如何在没有额外功能的情况下延迟jquery prop（，）

debugcn 发表于 Dev

yukashima huksay

我有一些单选按钮，我想更改在图像褪色后半秒钟一直使用jQuery检查的单选按钮，而无需添加任何额外功能，这是我的代码：

$("#myImage").fadeOut(1000);
$("#myRadioInput").delay(500).prop("checked",true)

为什么它不能按我的意愿工作？

乔恩·瑟雷尔（Jon Surrell）

动画不阻塞。这些功能实际上将同时被调用。您可以在此处查看示例：

$("#doIt").on('click', function(e) {
  e.preventDefault();

  $("#myDiv").fadeOut(1000);
  $("#myRadioInput").delay(500).prop("checked", true);

})

#myDiv {
  height: 10px;
  width: 10px;
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button type="button" id="doIt">Do It!</button>

<div id="myDiv"></div>
<input id="myRadioInput" type="checkbox">

此外，延迟无法按您预期的那样工作。它不会“暂停”该链。它通常会增加队列的延迟fx，这将使您可以暂停其他动画，但不能暂停链中的下一个呼叫。您可以在docs中查看此示例。

在问题中，您说：

无需添加任何额外功能

我不明白这项要求背后的动机。显而易见的解决方案是使用“额外”功能。我们毕竟是在编程；）

$("#doIt").on('click', function(e) {
  e.preventDefault();

  $("#myDiv").fadeOut(1000, function() {
    setTimeout(function() {
      $("#myRadioInput").delay(500).prop("checked", true);
    }, 500);
  });

})

#myDiv {
  height: 10px;
  width: 10px;
  background: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button type="button" id="doIt">Do It!</button>

<div id="myDiv"></div>
<input id="myRadioInput" type="checkbox">

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

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