jquery 函数仅适用于第一个div

jbose2ul 于 2023-03-07 发布在 jQuery

关注(0)|答案(2)|浏览(131)

我有两个相同的div和函数，如下所示。我的问题是，为什么这只适用于第一个dedicate__wrapper？当我点击第二个时，什么也没有发生，控制台没有错误。

$(document).ready(function() {
            $(".dedicate__wrapper").on('click', function() {
                        var el2 = document.querySelector(".dedicate__wrapper");
                        var el3 = document.querySelector(".config_submit");
        
        if (el2.classList.contains('step1')) {
                el3.classList.remove('disable');
              } else {
                      el3.classList.add('disable');
              }
            });
            
        });

<div class="dedicate__wrapper"></div>
<div class="dedicate__wrapper"></div>

我试着添加另一个点击事件，但没有帮助我。你有什么想法？

jquery

来源：https://stackoverflow.com/questions/75603588/function-works-only-for-first-div

2条答案

按热度按时间

dojqjjoe1#

这特指DOM中的 * first * 匹配元素：

var el2 = document.querySelector(".dedicate__wrapper");

在本例中，如果您要查找的元素就是您单击的元素，那么在jQuery click处理程序中，它就是this。
x一个一个一个一个x一个一个二个x
或者，要进一步使用jQuery：
一个三个三个一个
如果您有其他元素要标识相对于单击元素的 *，则可以从$(this)开始，通过traverse the DOM查找相对于单击元素的特定元素。

赞(0）回复(0）举报 2023-03-07

wfveoks02#

document.querySelector返回单个元素，因此您的条件将应用于找到的第一个DOM元素。
您将始终首先获得匹配的el2和el3
一半代码使用普通js，另一半代码使用jQuery
我会用这样的东西重写

$(document).ready(function() {
  $(".dedicate__wrapper").on('click', function() {
    var $el2 = $(this);
    var $el3 = $($(this).find(".config_submit"));//your logic here to find single config_submit

    if ($el2.hasClass('step1')) {
      $el3.removeClass('disable');
    } else {
      $el3.addClass('disable');
    }
  });
});

这里是伪小提琴：https://jsfiddle.net/nitinjs/528x0syo/17/

赞(0）回复(0）举报 2023-03-07

我来回答

jquery 函数仅适用于第一个div

2条答案

相关问题

热门标签

最新问答