为什么单击按钮时未触发我的jQuery事件？

Question

单击id = go的按钮时，我试图调用.ajax（）方法。 当触发另一个jQuery事件时显示该按钮，即单击具有称为谓词的类的按钮。

显示id = go的按钮没有任何问题，但是单击它时，没有发生应该发生的对alert（）或getResults（）方法的调用。 但是，如果我将id = go的按钮硬编码到页面中，而没有由jQuery生成，那么事情就很好了。

生成的HTML如下所示：

<div id="resultCount"><input name="val0" value="3" type="hidden">
val0=3&amp;<br><input name="go" id="go" value="go" type="button"></div>

为什么生成的代码会导致问题，如果我将按钮硬编码到页面上却不会导致问题。 $（“。object”）....可以忽略，暂时我仅触发$（“。predicate”）....。

$(document).ready( function() {
    $(".predicate").click( function() {
        makeQuery(this.id);
        //alert(this.id);
        });
    $(".object").click( function() {
        //alert(this.id);
        });
    var variables = 0;
    var queryString = "";
    var noOfResults;
    var formValues="";
    var goBegin = "";
    var goEnd = "<br/><input name='go' id='go' type='button' value='go'/>";
    function makeQuery(value) {
        queryString = queryString + "val" + variables + "=" + value + "&";
        formValues=formValues+"<input type='hidden' name='val"+variables+"' value='"+value+"' />";
        variables = variables + 1;
        $("#resultCount").html(goBegin+formValues+queryString+goEnd);           
    }
    function getResults(){
        $.ajax( {
            type : "GET",
            url : "ObjectCount",
            data : queryString + "count=" + variables,
            success : function(results) {
                noOfResults = results;
                $("#resultCount").html(results - 1 + " results");
            }
        });
    }
    $("#go").click( function() {
        alert("We have been alerted");
        getResults();
        });
});

Answer 1

动态生成按钮时，需要使用live()绑定事件。 现在，当您绑定按钮的事件时，该按钮尚不存在，因此在需要时将无法使用。 .live()方法将确保给定的处理程序现在或将来都将对使用给定选择器的所有元素起作用。

因此，您需要使用以下内容：

$('#go').live('click', function() {
    getResults();
});

也可以简化为：

$('#go').live('click', getResults);

Answer 2

问题是您在将id = go的元素插入DOM之前分配了click事件。

因此无法分配该事件。

在创建元素后立即使用live或分配事件。 在$("#resultCount").html(goBegin+formValues+queryString+goEnd); ..但在同一函数makeQuery ..中

Answer 3

完全没有答案，但是请尝试以下操作：

alert("Wiring up go button");
$("#go").click( function() {
    alert("We have been alerted");
    getResults();
    });
alert("go button wired!");

我经常发现我的文档中间存在一个错误。就绪代码（并不总是会引发错误）会使我一半的东西无法连接。