在ajax返回上綁定onChange

我正在取代我對ajax回調的選擇。在下拉列表中我看到返回的列表，但是當我嘗試綁定更改事件時，它給我提供了不正確的值。該警報顯示我「值未定義」，當我更改下拉列表中的選定選項時，如何查看正確的值？在ajax返回上綁定onChange

如果我的下拉列表中有值（「value1」，「value2」，「value3」），並且如果我選擇「value1」，警報應該顯示「value is value1」。

if (status == "success") { 

    var mysel = $('#Namelist').empty(); 


    for (var i = 0; i < data.length; i++) { 
     mysel.append('<option value="' + 
      data[i] + '">' + 
      data[i] + '</option>'); 
    } 

    $("#Namelist").replaceWith(mysel); 
    $('#Namelist').bind('change', function() { 
     alert('Value change to ' + $(this).attr('value')); 
    }); 
}

來源

2015-06-15 user1651888

我不認爲你真的需要'$（「＃Namelist」）。replaceWith（mysel）'。此外，您應該更早地綁定更改處理程序，而不是在每個AJAX回調中。 –

更換

$("#Namelist").replaceWith(mysel);

與

$("#Namelist").append(mysel);

那麼你不必ajax後再次綁定event上#Namelist。

完整代碼

if (status == "success") { 
    var options = ''; 

    for (var i = 0; i < data.length; i++) { 
     options += '<option value="' + data[i] + '">' + data[i] + '</option>'; 
    } 

    $("#Namelist").html(options); 
} 

// Outside of ajax function 
$('#Namelist').on('change', function() { 
    alert('Value change to ' + $(this).val()); 
});

來源

2015-06-15 06:25:58 Tushar

你應該嘗試讓val()而不是attr('value')：

DEMO

$('#Namelist').bind('change', function() { 
     alert('Value change to ' + $(this).val()); 
});

來源

2015-06-15 06:27:16

並更好地使用'this.value' –

@ A.Wolff'$（this）.val（）'也處理多個選擇，而'this.value'不處理，所以仍然有一些優勢作爲單一尺寸所有的呼叫。 –

@Jack再次感謝您的建議..完成更改.. –

一個<select>元素通常沒有生成的attr ibute叫做value。要獲得此元素的選定值，您需要查詢其.value屬性。

的jQuery有一個方便的包裝稱爲.val()：

$('#Namelist').bind('change', function() { 
 
    alert('Value change to ' + $(this).val()); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="Namelist" />

我建議只在您的網頁，例如綁定更改處理一次當DOM準備就緒時：

jQuery(function($) { 
    // attach change handler here 
});

多次註冊相同的事件處理程序幾乎總是不是你想要的。

而且，你不需要這個電話：

$("#Namelist").replaceWith(mysel);

到那個時候選擇元素已填充來自您的AJAX響應的所有選項。

來源

2015-06-15 06:36:24

提示從ajax回調中刪除onChange事件是好的。

Moved the $('#Namelist').on('change',function() {} from ajax callback 

to jQuery(function($) {}); 



$('#NameList').on('change', function() { 
       alert('Value changed to ' + $(this).val()); 
    });

來源

2015-06-15 07:09:31 user1651888

在ajax返回上綁定onChange

回答

相關問題