时间戳

首页 > 解决方案 > 选择下拉菜单后如何更改输入值

html - 选择下拉菜单后如何更改输入值

问题描述

当用户在输入下拉列表中选择数据时，我想更改输入值。在 html 下拉列表中循环和设置数据值后要做的第一件事是检查该选项是否被选中，但我对如何检查它感到困惑，所以我只是通过下拉 id 检查但它没有工作，那么如果选择了如何检查数据输入呢？

这是我第一次返回数据下拉列表的 ajax 代码：

$.ajax({
    url : "{{ url('web/city/getdatacity') }}",
    type : "POST",
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')
    },
    data : {
        province_id:id
    },
    success : function(data){
        var html = '';
        var postcode = '';
        var i;

        if(data.length == 0) {
          html += '<option value = ""> City not found!</option>';
        } else {
            for(i=0; i<data.length; i++) {
                html += '<option value = "'+ data[i].city_id +'">' + data[i].city_name +'</option>';
                
                if($('#city_id').is(':selected')) { //here the problem when check if option above selected or not
                    postcode = data[i].postal_code;  //input postal code in var postcode if true
                }
            }
        }
        $('.city').html(html);
        $('#postalcode').val(postcode);   //auto fill postal code value from postcode
    })
});

标签： htmljqueryajax

解决方案

而不是使用 selected 或 onchange 尝试使用您的 options 属性进行类似的操作。

看看oninput

<label for="cars">Choose a car:</label>

<select id="cars" name="cars" oninput="console.log(this.value)">
  <option value="volvo">Volvo XC90</option>
  <option value="saab">Saab 95</option>
  <option value="mercedes">Mercedes SLK</option>
  <option value="audi">Audi TT</option>
</select>

推荐阅读