Question

我正在生成具有唯一ID的动态css按钮，我正在使用以下点击处理程序捕获click事件

$(document.body).on('click', 'a', function() {
    if (typeof(this.id) != "undefined") { //check if id exists
        var n = this.id.split("%");
        if (n[0] == "jsonpbtn") { //check if one of our buttons    
            var surl = "http://www.blah.com/tree/jsonp/foo/" + n[1];
            $.ajax({
                url: surl,
                cache: false,
                dataType: "jsonp",
                jsonp: false,
                jsonpCallback: 'foo',
                error: function(XHR, textStatus, errorThrown) {
                    alert(textStatus + ":" + errorThrown)
                },
                success: function(foo) {
                    $('#blah' + foo.id).html(foo.message);
                }
            });
        }
    }
});

虽然ajax调用工作，但页面生成错误“parsererror：错误：foo未被调用”;我相信问题是这会循环遍历页面上的所有“a”元素为每个“jsonpbtn”调用函数？

Answer 1

我发现通过在ajax调用之前插入一个初步阶段来更改按钮状态可以解决问题。

$(document.body).on('click', 'a', function() {
if (typeof(this.id) != "undefined") { //check if id exists
    var n = this.id.split("%");
    if (n[0] == "jsonpbtn") { //check if one of our buttons    
        var surl = "http://www.blah.com/tree/jsonp/foo/" + n[1];
        $('#div_id'+n[1]).html('<a class="button" href="#">working</a>');//<-added this
        $.ajax({
            url: surl,
            cache: false,
            dataType: "jsonp",
            jsonp: false,
            jsonpCallback: 'foo',
            error: function(XHR, textStatus, errorThrown) {
                alert(textStatus + ":" + errorThrown)
            },
            success: function(foo) {
                $('#blah' + foo.id).html(foo.message);
            }
        });
    }
}
});

感谢那些试图提供帮助的人。问候马丁

动态按钮和on.click事件问题

1 个答案: