为什么单击按钮时没有触发我的jQuery事件?

时间:2010-03-27 10:34:56

标签: html jquery

当点击id = go的按钮时,我试图调用.ajax()方法。触发另一个jQuery事件时会显示此按钮,即单击一个名为谓词类的按钮。

显示id = go的按钮没有任何问题,但点击它时,没有调用应该发生的alert()或getResults()方法。如果我用id =进入页面硬编码按钮并且没有由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();
        });
});

3 个答案:

答案 0 :(得分:2)

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

所以你需要使用这样的东西:

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

这也可以简化为:

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

答案 1 :(得分:1)

问题是您在DOM中插入id = go的元素之前指定了click事件...

因此无法分配事件..

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

答案 2 :(得分:0)

完全不是答案,但请尝试:

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

我经常发现我的document.ready代码中间的一个错误,它并不总是会触发错误,会让我的一半东西没有连线。