Question

我正在尝试更改元素的文本值，如果另一个元素有一个类，但我目前正在做的是没有显示结果。

$(document).ready(function () {
    $('#number').text('00');

    setTimeout(function () {
        $('#test').removeClass('initial-number').addClass('change-number');
    }, 500);
});

$(document).change(function () {
    if ($('#test').hasClass('change-number') === true) {
        $('#number').text('10');
    };
});

#test {
  height: 2em;
  width: 2em;
}

.initial-number {
  background: blue;
}

.change-number {
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<span id="number"></span>
<div class="initial-number" id="test"></div>

Answer 1

document没有change个事件;这只适用于表单字段元素。

您可以使用mutation observers来观察相关元素属性的更改。它们在现代浏览器上得到了很好的支持;在略微不太现代的浏览器上，您可以使用旧的突变事件找到polyfill。在非常老的浏览器上，你必须进行民意调查。

Answer 2

试试这个

＆＃13;

   $(document).ready(function () {
$('#number').text('00');

setTimeout(function(){
  $('#test').removeClass('initial-number').addClass('change-number');
   $('#number').text('10');
  }, 500);
});

＆＃13;

#test {
  height: 2em;
  width: 2em;
}

.initial-number {
  background: blue;
}

.change-number {
  background: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<span id="number"></span>
<div class="initial-number" id="test"></div>

＆＃13;

Answer 3

为什么不简单地将它包含在setTimeout函数中：

$(document).ready(function () {
    $('#number').text('00');

    setTimeout(function () {
        $('#test').removeClass('initial-number').addClass('change-number');
        if ($('#test').hasClass('change-number')) {
            $('#number').text('10');
        };
    }, 500);
});

Answer 4

试试这个

 $(document).bind('DOMSubtreeModified', function () {
       if ($('#test').hasClass('change-number') === true) {
        $('#number').text('10');
      };
    });

更改仅适用于输入，文本区域或选择元素。

如果另一个元素具有某个类，则jQuery更改元素的文本

4 个答案: