Question

我正在尝试获取if else语句，如果#selectedwhip div具有.active类，则允许我运行函数。如果没有，我希望它运行另一个功能。我刚刚使用控制台查看它是否可以工作，但它只返回控制台中的else语句。

该场景是3个图像，充当链接。通过单击链接，他们将活动类添加到另一个div。通过激活，图像将插入div。单击图像会向div添加活动类，但不会导致if语句登录到控制台。

是否存在妨碍其正常工作的内容？

的jQuery

    $(".carbutton").click(function(){
      $("#selectedwhip").addClass("active");
    });

    $(function() {
      if ($("#selectedwhip").hasClass("active")) {
        console.log('active');
      }
      else {
        console.log('unactive');
      }
    });

HTML

  <div class="cars">
    <h1>Title</h1>
    <div class="section group trio-cars">
        <div class="col span_1_of_3 carbutton" id="carbutton">
        <a id="car1"><img src="img/frontleftbmw.jpg" width="100%"></a>
        </div>
        <div class="col span_1_of_3 carbutton" id="carbutton">
        <a id="car2"><img src="http://placehold.it/350x150" width="100%"></a>
        </div>
        <div class="col span_1_of_3 carbutton" id="carbutton">
        <a id="car3"><img src="http://placehold.it/350x150" width="100%"></a>
        </div>
    </div>
    </div>

        <div class="col span_1_of_3">
         <div class="stats-image" id="selectedwhip">
         </div>
        </div>

Answer 1

你必须有一个检查功能，例如：

function check() {
  if ($("#selectedwhip").hasClass("active")) {
    console.log('active');
  } else {
    console.log('unactive');
  }
}

$(function() {
  $(".carbutton").click(function() {
    $("#selectedwhip").addClass("active");
    check();
  });
});

刚刚注意到您有重复的ID carbutton，这使其成为无效的标记创建。每个ID都必须是唯一的。

Answer 2

你必须清楚你想做什么以及什么时候做。因为你只是立即执行一个功能，页面就绪了

$(function() {
  if ($("#selectedwhip").hasClass("active")) {
    console.log('active');
  }
  else {
    console.log('unactive');
  }
});

上面的代码将检查selectwhip是否在第一次加载页面时具有活动类。你必须将这个条件附加到一个事件

如果div具有活动类，则运行函数，否则使用jQuery运行另一个函数

2 个答案: