2
 $(document).ready(function () {
var user = 1;
 $("a.like").on("click", function () {
            var article = $(this).attr('data-article');
            $.ajax({
                type: "POST",
                url: "WebService.asmx/Like",
                data: "{ 'user': '" + user + "', 'article': '" + article + "' }",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    if(msg.d ==  1)
                    {
                        $(".like[data-article='" + article + "']").fadeOut(700).addClass('unlike').removeClass('like').stop().text('Unlike').fadeIn(700);
                    }
                },
                failure: function (msg) {
                    alert(msg.d);
                }
            });
        });

$("a.unlike").on("click", function () {
            var article = $(this).attr('data-article');
            $.ajax({
                type: "POST",
                url: "WebService.asmx/Unlike",
                data: "{ 'user': '" + user + "', 'article': '" + article + "' }",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    if(msg.d ==  1)
                    {
                        $(".unlike[data-article='" + article + "']").fadeOut(700).addClass('like').removeClass('unlike').stop().text('Like').fadeIn(700);
                    }

                },
                failure: function (msg) {
                    alert(msg.d);
                }
            });
        });
});

当我单击具有类的链接时,它工作正常,当我单击具有类的链接时,它与此不同。但是,当我单击同一链接两次时它不起作用!当我在互联网上搜索时,我发现我必须使用 live 而不是 click,但是 live 在 1.8 版本上已被弃用。我怎样才能使这种火灾多次?

4

4 回答 4

10

使用jQuery.on()

$( document ).on( 'click', 'a.like', function () {
    // Do click stuff here
} );

http://api.jquery.com/on/

您需要绑定on到始终存在的元素。(文档或一些主要的包装 div)。与动态元素一起使用on将不起作用。

于 2012-11-05T17:24:02.257 回答
5

如果你想使用on而不是live你需要写类似的东西

$('#container').on('click', '.a.unlike', function () {

自从

$("a.like").on("click", function () {

就像bind()它被弃用之前一样工作。

如果你想像我的第一个例子on()一样,live()你需要传递 3 个参数。

.on() 方法将事件处理程序附加到 jQuery 对象中当前选定的元素集。从 jQuery 1.7 开始,.on()方法提供了附加事件处理程序所需的所有功能。有关从旧 jQuery 事件方法转换的帮助,请参阅.bind().delegate().live()。要删除与 .on() 绑定的事件,请参阅 .off()。要附加仅运行一次然后自行删除的事件,请参阅 .one()

于 2012-11-05T17:25:11.707 回答
1
$(document).on("click","a.unlike", function () {

是 on 的实时/委托格式。

http://api.jquery.com/live/

于 2012-11-11T15:00:21.900 回答
0

在 ajax 调用之后 javascript 可以工作之前,您需要再次创建代码块的新实例,例如

<div class="clicks">
   //Ajax results comes here. For instance if we have sets of <a>Click me</a>, all we need to do is, when the call is successful we should construct our block of codes again because after document loads, javascript only read already existing elements.
</div>

var xhttp;
if (window.XMLHttpRequest) {
    xhttp = new XMLHttpRequest();
} else {
        // code for IE6, IE5
        xhttp = new ActiveXObject("Microsoft.XMLHTTP");`
        }

xhttp.onreadystatechange = function() {
    if(xhttp.readyState === 4 && xhttp.status === 200){
        $('.clicks').html(xhttp.responseText);
        //now re-create your functions here
        $('.clicks a').click(function(){
          alert('clicks worked after ajax call');
        });
    }
};
xhttp.open("GET","index.html",true);
xhttp.send(null);
于 2016-11-02T20:27:21.517 回答