Question

我们有以下使用ajax和httphandler Web服务（.ashx）动态填充的SELECT组合框。

当动态填充SELECT组合框时，它看起来像这样：

<select name="selectid" id="selectid">
<option value="">-Select an option-</option>
<option value="1">Test1</option>
<option value="2">Test2</option>
<option value="3">Test3</o4tion>
<option value="4">Test5</option>
<option value="5">Test6</option>
<option value="6">Test7</option>
  </select>

以下是js：

function getText() {
    $.ajax({
        url: 'rulings.ashx',
        dataType: 'json'
    })
    .done(function(textInfo) {
        $(textInfo).each(function(i, texts) {
            $('<option>').val(texts.dbtextID).text(texts.textToBeDisplayed).appendTo( $('#selectid') );


        })
    });
}

当我们从下拉列表中显示值时，它会显示VALUE选项而不是显示的文本。

上面的组合框示例中，它显示1而不是Test1。

如何修改脚本以显示显示的文本而不是VALUE选项？

Answer 1

尝试使用此代码，只需将其放入

即可

$(document).ready(function(event){
    $("#selectid").on('change',function() {
        //alert($("#selectid option:selected").text());
        $('#summTextvalue').html($("#selectid option:selected").text());
    });
})

jQuery中的ON方法可以将事件绑定到动态创建的元素。

或者您也可以执行类似

的操作

function _bindEvent()
{
    $("#selectid").on('change',function() {
        alert($("#selectid option:selected").text());
    });
}

并从您的AJAX完成方法中调用_bindEvent()

Answer 2

尝试此操作来获取文本，而不是值。

$('#selectid').change(function(){

   var selectedVal=$(this).val();
   alert($(this).children("option[value='"+selectedVal+"']").text());

});

如何选择显示值而不是VALUE选项？

2 个答案: