Question

我今天得到了一些帮助，这就是我想出来的：

      $(window).keypress(function (e)
      {
          if (e.keyCode == 13)
          {
              $('#doCheck')
        .css('color', '#666')
        .delay(100)
        .queue(function (next)
        {
            $(this).css('color', '#00ff00');
            next();
        });

        doCheck('mark1');
      }

<input id='doCheck' type="button" onclick="doCheck('mark1'); return false;" value="Mark" />

这里的想法是，当用户按下ENTER键时，按钮的颜色将改变颜色100毫秒，同时我调用一个名为doCheck的函数来调用AJAX。

我的问题是，在按钮的颜色变回＃666之前，似乎有一些最小延迟几乎一秒钟。我期望更短的时间，但即使我将延迟设置为10，它仍然似乎延迟1/2至1秒。我应该补充一点，如果我设置一个长时间延迟，如5秒，那么它确实会做五秒钟。

我看不出这里有什么问题。

有没有人有任何想法？

感谢，

这是doCheck功能。该功能正常工作。只是按钮的事情给了我一些问题。请注意，我刚将其更改为async：true

function doCheck(task)
      {
          var parms = {
              task: task,
              pk: $('#Q_PartitionKey').val(),
              rk: $('#Q_RowKey').val(),
          };
          $.ajax({
              type: "POST",
              traditional: true,
              url: '/power/check',
              async: true,
              data: parms,
              dataType: "json",
              success: function (data)
              {
                  // $('#doCheckMark').attr("disabled", false);
                  // $('#doCheckMark').css("color", "#000");
              },
              error: function ()
              {
                  var cdefg = data;
              }
          });
      }

Answer 1

doCheck正在进行同步通话吗？如果是这样，排队的函数将不会被调用，直到您的ajax调用返回...这可能会导致意外的延迟。

修复方法是确保doCheck使用正确的异步调用。

Answer 2

因此，您似乎想要更改颜色，然后等待一段时间并将其更改回来。不需要排队。

$(window).keypress(function (e)
  {
      if (e.keyCode == 13)
      {
          $('#doCheck')
            .css('color', '#666')
            .delay(100)
            .css('color', '#00ff00');

          doCheck('mark1');  // make sure ajax only runs when correct keycode is pressed
      }
  }

我很好奇你是否希望这个效果附加到ajax调用本身或来自页面的所有ajax请求。如果是这样，请尝试将颜色效果与ajax请求联系起来，或使用ajaxStart或ajaxStop。

Answer 3

这个怎么样？

$(window).keypress(function (e)
{
          if (e.keyCode == 13)
          {
              $('#doCheck').css('color', '#00ff00');
              setTimeout(function(){
                  $('#doCheck').css('color', '#666');
              },100);

              doCheck('mark1');
          }
});

Answer 4

您已经找到了解决方案，但请注意对良好做法的喜爱，将内联“onclick”更改为jQuery pub / sub模型。

这是example on how to do pub/sub jQuery event handling

jQuery延迟似乎没有为这种事件提供正确的延迟

4 个答案: