检查点击的类是否有特定的 ID

穆特

如何检查点击class是否对应于某个ID

<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" id="profile-tab" href="#">Alle machines</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="laser" href="#">Lasersnijden</a>
  </li>
</ul>

<script type="text/javascript">
    // Change class on click
    $(".nav-link").click(function() {
        $('.nav-link').removeClass('active')
        $(this).addClass("active");

        if($(this) == document.getElementById('laser')) { alert("Laser clicked."); }
    });
</script>
马蒙

$(this) 返回一个包含 DOM 对象的 jQuery 对象

然而

document.getElementById('laser') 返回一个 HTML DOM 对象。

显然它们不一样。如果使用$(this),则必须使用如下索引:

if($(this)[0] == document.getElementById('laser'))

// Change class on click
$(".nav-link").click(function() {
  $('.nav-link').removeClass('active')
  $(this).addClass("active");
  if($(this)[0] == document.getElementById('laser')) { 
    alert("Laser clicked."); 
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" id="profile-tab" href="#">Alle machines</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="laser" href="#">Lasersnijden</a>
  </li>
</ul>

虽然不是检查整个对象,您可以简单地检查 id

// Change class on click
$(".nav-link").click(function() {
  $('.nav-link').removeClass('active')
  $(this).addClass("active");
  if($(this).attr('id') == 'laser') { 
    alert("Laser clicked."); 
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="nav nav-tabs">
  <li class="nav-item">
    <a class="nav-link active" id="profile-tab" href="#">Alle machines</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" id="laser" href="#">Lasersnijden</a>
  </li>
</ul>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章