Question

这是我的代码：

＆＃13;

$.ajax({
		url: "server.do?button=go&flag=false",
 		type: "GET",
		success: function(data) {
			var respContent = "";
			respContent += data;
                        $("#ajaxResponse").show();
			$("#ajaxResponse").html(data);
			
		}
 		});

＆＃13;

 
<span id="ajaxResponse" style="display:none"></span>

＆＃13;

这就是我所拥有的HTML绑定到ajaxResponse span：

＆＃13;

<span style="" id="ajaxResponse"><select tabindex="12" id="aId" name="aId"><option value="ANY">ANY</option><option value="1">ABC</option><option value="2">XYZ</option></select></span>

＆＃13;

正如您在上面所看到的，我从服务器发送回复的HTML响应。下拉列表格式正确，并附加到ajaxResponse div。下拉列表出现并在开发人员工具浏览器控件中很好地形成。但是下拉列表不会触发更改事件上的jQuery。我认为DOM已经加载了，jQuery无法找到要更改的On change事件的ID。这意味着：

＆＃13;

 $("#aId").change(function(e) {
//How do i fire this event ??
  alert('I am never called');
});

＆＃13;

我的问题是如何为服务器端发送的下拉列表调用上述函数？

Answer 1

试试这个：

$.ajax({
    url: "server.do?button=go&flag=false",
    type: "GET",
}).done(function (data) {
    var respContent = "";
    respContent += data;
    $("#ajaxResponse").show();
    $("#ajaxResponse").html(data);
})
.fail(function () {
    console.log("error");
});

Answer 2

试试这个：

jQuery 1.7以后使用＆＃34; on＆＃34;，对于先前版本，你可以使用＆＃34; live＆＃34;

$(document).on('change','#aId', function(e) { //How do i fire this event ?? alert('I am never called'); });

当文档就绪时，元素（#aId）不可用。因此，不会分配更改事件，因为我们需要动态绑定更改事件。

Answer 3

每次在ajax响应之后呈现事件处理程序时都必须以这种方式绑定事件处理程序（按照您的示例）：

$.ajax({
    url: "server.do?button=go&flag=false",
    type: "GET",
    success: function(data) {
        var respContent = "";
        respContent += data;
                    $("#ajaxResponse").show();
        $("#ajaxResponse").html(data);
        // add a event handled for 'change' every time you render it
        $("#aId").change(function(e) {
           var select = $(this);
           console.log('this should work.',select.val());
        });
    }
    });

在Javascript中的ajax响应之后未调用下拉事件

3 个答案: