Question

我有一个由ajax附加的选择列表（#searchHistory）：

var toAppend = '<option rel="' + relval + '">' + eVal + '</option>';
$("#searchHistory").append(toAppend);

并且为选择框注册了点击事件

 $('#searchHistory option').click( function() {
    var shOpt = $(this);
    var relVal = shOpt.attr('rel');

    alert(relVal);
});

我的问题是选择框的最后一项不会触发点击事件!!!!点击后所有其他项目都有效。有趣的是，当我在APPEND上使用PREPEND时，第一项不会触发click事件，所有其他项目都可以正常工作。请注意，选择框由上面的ajax代码填充。这意味着，如果我在列表框中添加另一个，那么之前的非工作项目运行良好，但最近添加的项目仍无效。

任何想法请??? 感谢

Answer 1

尝试

$('#searchHistory').change( function() {
    var shOpt = $(this).find('option:selected');
    var relVal = shOpt.attr('rel');

    alert(relVal);
});

Answer 2

附加项目不会正常触发事件，因此您需要尝试“on”方法：

 $(function(){
$('body').on("change","#searchHistory", function() {
var shOpt = $(this);
var relVal = shOpt.attr('rel');

alert(relVal);

}）; }）

jQuery "on"

ajax单击事件未触发选择选项

2 个答案: