根據下拉選項更改隱藏字段值

Question

我需要一些基本的JavaScript幫助。 我有一個帶有下拉菜單的表單。 基於該下拉選擇中的選擇，我想更改隱藏字段的值。

例如，如果用戶在下拉菜單中選擇“ Google”，則我希望隱藏字段顯示“ https://google.com ”，如果用戶選擇“ Bing”，我希望隱藏字段顯示“ https：//” bing.com 。”

一個警告（不確定是否會更改腳本）是我為下拉菜單設置了唯一的值。 例如，“ Google”的值為5，而Bing的值為10。

任何幫助將不勝感激！

我已經嘗試過以下簡單腳本，但是我對Javascript經驗不足，因此可能不正確。

<script>
var service = $('#service').val();
if(service == 'Google'){
   $('#hidden_field').val('https://google.com/')
} else {
   $('#hidden_field').val('https://bing.com')
}  
</script>

在上面的示例中，我希望Google的服務選項將Google URL添加到隱藏字段，所有其他選項將顯示Bing。

Answer 1

您需要將javascript代碼包裝到一個函數中並將其綁定到事件處理程序：

<script>
    function fill()
    {
      let service = $('#service').val();
      if(service == 'Google'){
       $('#hidden_field').val('https://google.com/')
      } else {
       $('#hidden_field').val('https://bing.com')
      }
    }

    /* And the binding */
    $(document).ready(function()
    {
       $('#service').on("change", fill);
    });
</script>

Answer 2

您需要響應選擇列表的更改事件：

<script>
$(function() {
    $('#service').on('change', function(e) {
        var score=e.target.value;
        $('#hidden_field').val(score);
    });
})
</script>