Question

我在if语句中进行了比较，以检查ID是否相同，但我想检测与{{1}具有相同ID的B元素元素并给他一个班级。您可以在此脚本中看到问题：

＆＃13;

jQuery('.button').click(function() {
  var a = jQuery('.a').attr('id')
  var b = jQuery('.b').attr('id')

  if (a === b) {

    // "jQuery(this)" should be the detectet B-element, which has the same "id" as A
    // ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
    jQuery(this).addClass("active");
    jQuery(this).css("background", "red");

    // But it detects the button as "jQuery(this)"

  } else {
    return;
  }
});

＆＃13;

.a,
.b,
.c {
  width: 100px;
  height: 100px;
  margin: 1em;
  background: blue;
}

＆＃13;

感谢您的帮助！

Answer 1

以下是您可以查看的优化代码。您可以使用data属性代替ID：

jQuery('.button').click(function() {
  var a = jQuery('.a').data('check');
  var $belement = jQuery('.b');
  var b = $belement.data('check');

  if (a === b) {
    $belement.addClass("active").css("background", "red");
  }
});

.a,
.b,
.c {
  width: 100px;
  height: 100px;
  margin: 1em;
  background: blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="button">Button</a>
<div class="a" id="block-a" data-check="block">A</div>
<div class="b" id="block-b" data-check="block">B</div>
<div class="c" id="notblock" data-check="notblock">C</div>

理想情况下，DOM不应该具有相同的ID。 ID是唯一的，类可以相同。因此，你的整个逻辑或问题都是不正确的。您应该比较一些值或其他属性，但不要比较ID。 ID无法比较，因为它们应该是唯一的。

Answer 2

jQuery('.button').click(function() {
    var a = jQuery('.a').attr('id')
    var b = jQuery('.b').attr('id')
    if (a === b ) {
          // "jQuery(this)" should be the detectet B-element, which has the same "id" as A
          // ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
          jQuery('.b').addClass("active");
          jQuery('.b').css("background", "red");
          // But it detects the button as "jQuery(this)"
    }
    else {
      return;
    }
});

将该类添加到元素中。

Answer 3

试试这个：你需要得到b元素jquery对象，这里jQuery（this）是你点击的按钮

＆＃13;

jQuery('.button').click(function() {
    var a = jQuery('.a').attr('id');
    var $belement = jQuery('.b');
    var b = $belement.attr('id')

    if (a === b ) {
          
          // "jQuery(this)" should be the detectet B-element, which has the same "id" as A
          // ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
          $belement.addClass("active");
          $belement.css("background", "red");
          
          // But it detects the button as "jQuery(this)"

    }
    else {
      return;
    }
});

＆＃13;

.a, .b, .c {
  width: 100px;
  height: 100px;
  margin: 1em;
  background: blue;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="button">Button</a>
<div class="a" id="block">A</div>
<div class="b" id="block">B</div>
<div class="c" id="notblock">C</div>

＆＃13;

从if语句中的比较中获取值/解决方案

3 个答案: