Question

我正在构建一个从数据库中随机填充多行文本的系统，但每行都有一个“保持”状态。按钮（就像水果机器）保持那条线而其他线被重新生成 - 我使用AJAX来做这个并且该位工作正常。

<div id="hold1" class="rememberthis"></div><div id="line1">Foo</div>
<div id="hold2" class="rememberthis"></div><div id="line2">Bar</div>
etc...

我正在使用JQuery来切换＆＃39; hold＆＃39;每行按钮 - 例如：

    $("#hold1").click(function(){
      $('#hold1').toggleClass("lineselected");
    });

然后，我试图查询保持按钮是否具有＆＃34; llectedlected＆＃34; class - 作为一种阻止JQuery AJAX .load函数重新加载内容的方法 - 因此＆＃39;持有＆＃39;特定的那一行。 #recycle是重新加载所有内容的按钮。

if(!$('#hold1').hasClass("lineselected")){
$('#recycle').click(function(){
    $( "#line1" ).load( "index.php #inline1" );
});
}

......但它不起作用！

最高位有效 - ＆＃34; llectedlected＆＃34;班级很好地切换。此外，如果我将hasClass（）硬编码到它在原始载荷上的东西（例如＆＃34; rememberthis＆＃34;），它就可以工作。所以JQuery的两个部分独立工作......他们只是一起工作 ......

任何想法可能会出错？

非常感谢提前！

Answer 1

这主要是因为你的元素id是“＃hold1”而不仅仅是“hold1” 所以$（'＃hold1'）找不到元素。

Answer 2

而不是

if(!$('#hold1').hasClass("lineselected")){
    $('#recycle').click(function(){
        $( "#line1" ).load( "index.php #inline1" );
    });
}
// probably same code repeats for #hold2, #hold3, etc

试

$('#recycle').click(function(){
    if(!$('#hold1').hasClass("lineselected")){
        $( "#line1" ).load( "index.php #inline1" );
    }
    // you should repeat for #hold2, #hold3 here
});

这里的作用是将if-check放入点击事件中。

在原始代码中，多次调用$('#recycle').click。这基本上将点击事件多次绑定到#recycle。您可能忘记解开这些事件（在这种情况下，我认为在下次检查之前很难找到并解开它们......）。所以它不起作用。

我的回答建议你将条件检查放在click事件处理程序中，并且只绑定一次。

JQuery＆＃39;持有＆＃39; button - toggleClass vs hasClass兼容性问题？

2 个答案: