1

我似乎无法弄清楚为什么这不起作用,如果您检查下面的链接,然后添加 3 位客人,然后删除一位,柜台就会变得精神恍惚。

http://www.waterfrontexeter.co.uk/preordernew/

    var count = 1;
    $(".removeOrder").on('click', function(){

                count--;
                $("#counter").html("Total Number of Guest: " + count);
                $("input[id=totalguest]").val("Total Number of Guest: " + count);

        });

到目前为止,这是我的代码,我认为一切看起来都很好?我尝试了相反的方法,它加起来很好。

4

2 回答 2

1

您将遇到的一个问题是每次单击添加访客按钮时都会创建新的单击处理程序...

$(".add").click(function () {
    $(".removeOrder").on('click', function(){
        $(this).parents(".duplicate").remove();
        count--;
        $("#counter").html("Total Number of Guest: " + count);
        $("input[id=totalguest]").val("Total Number of Guest: " + count);
    });
});

当你运行它时会发生什么,你添加了很多额外的点击处理程序。

根据经验,永远不要在事件回调中添加点击处理程序。

要修复它,您应该将点击处理程序移动到委托事件...

$(document).on('click', '.removeOrder', function(){
    $(event.target).closest(".duplicate").remove();
    count--;
    $("#counter").html("Total Number of Guest: " + count);
    $("input[id=totalguest]").val("Total Number of Guest: " + count);
});
于 2013-03-26T17:37:03.073 回答
1

我认为,问题在于您网站上的 js 代码结构不完善。为了避免此类错误,我建议您以更灵活的方式进行操作:

...
count = $(".duplicate").length; 
...

或者,更好的是,您可以直接编写字符串而不将计数器存储在变量中:

var strCount = '';
...
strCount = "Total Number of Guest: " + $(".duplicate").length;
$("#counter").html(strCount);
$("input[id=totalguest]").val(strCount);
于 2013-03-26T17:14:00.077 回答