jquery：选择选项选择的属性在更改时未更改

Question

我的问题是我有一个下拉列表，其 SelectedValue 没有在回发时传递给 ASP.NET。从页面中提取 jquery 更改处理程序并隔离选项的选择后，我可以看到即使 ":selected" 给了我新选择的选项，它不会粘住，因此空白选项值被传递回服务器。

这个 jsfiddle 重现了这个问题。从列表中选择一个选项，然后单击“开始”并查看警告框中显示的 html 以了解我在说什么。

http://jsfiddle.net/GAcEw/

这是一个独立的页面版本：

<script type="text/javascript"   src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
    $('#ddl').on('change', function (e) {
       $('.sv').text($(this).find(":selected").attr('value'));
       });
$('#go').click(function() { alert($('#ddl').html()) });
       });
</script>
<select name="ddl" id="ddl">
<option selected="selected" value="">-- Choose --</option>
<option value="1">Degree</option>
<option value="2">HND</option>
<option value="16">HNC</option>
</select>
<div><span>SelectedValue: </span><span class="sv"></span></div>
<div><input id="go" type="button" value="go"/></div>

我做错了什么？

干杯， .pd.

编辑：

用户控件的代码隐藏。设置是 Master->Page->TabControl->UserControl->DropDownList

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load


    JSHelper.Add("/scripts/jquery-stuff.js", Me.Page)

    If Not IsPostBack Then
        bindDDL(ddl, True, "")

    End If
End Sub

Public Shared Sub bindDDL(ByRef _ddl As DropDownList, Optional ByVal _incBlank As Boolean = False, Optional ByVal _valBlank As String = "")
    _ddl.Items.Clear()
    If _incBlank Then
        _ddl.Items.Add(New ListItem("-- Choose --", _valBlank))
    End If
    _ddl.AppendDataBoundItems = True
    _ddl.DataSource = QualificationTypeGetActive()
    _ddl.DataTextField = "Description"
    _ddl.DataValueField = "QualificationTypeID"
    _ddl.DataBind()

End Sub

Answer 1

来自 jquery 的 .html 将返回您初始化的任何数据，因为它使用浏览器的 innerHTML 属性，但如果您尝试提交数据，则您的数据没有问题。所以不用担心它会在 DOM 中发生变化，这里有一个证明：

<form class='test'>
<select name="ddl" id="ddl">
    <option selected="selected" value="">-- Choose --</option>
    <option value="1">Degree</option>
    <option value="2">HND</option>
    <option value="16">HNC</option>
</select>

$(function () {
    $('#ddl').on('change', function (e) {
        $('.sv').text($(this).find(":selected").attr('value'));
    });
    $('#go').click(function () {
        alert($('#ddl').html())
    });
    $('.test').submit(function(e){
        e.preventDefault();
        console.log($(this).serializeArray());
    });
});

结果：

0: Object
   name: "ddl" 
   value: "2" // I selected your second option while testing

Try it yourself