控制div的淡出和淡入

Question

I would like the #preview to blink every sec as I make changes to #companyName .当我对#companyName进行更改时，我希望 #preview 每秒闪烁一次。

Also, I would like the blinking of #preview to stop 1 sec after I stop making changes to #companyName for 2sec.另外，我想的闪烁#preview停1秒我停在修改后#companyName为2秒。

  <html>
      <body>
          <div id="edit">
                  <label>Company Name: </label>
                  <input type="text" id="companyName" />
          </div>
          <div id="preview">
                  <label id="preview" style ="font-size: 20px;">
                          This is my company
                  </label>
          </div>
      <script>

      $('#companyName').keyup(function() {
          delay(function(){
            var value = $(this).val();
            $('#preview').fadeOut().fadeIn();  
            $("#preview").text(value);
            
          }, 2000 );
      });

      
      var delay = (function(){
        var timer = 0;
        return function(callback, ms){
          clearTimeout (timer);
          timer = setTimeout(callback, ms);
        };
      })();

      </script>
 </body>

Answer 1

If you want to blink the #preview on keyup and get it back after 2secs what you can do is,如果您想在 keyup 上闪烁 #preview 并在 2 秒后取回它，您可以做的是，

$('#companyName').keyup(function() {
     var $prev=$('#preview').fadeOut().fadeIn();   
     delay(function(){          
        $prev.html($(this).val()).fadeIn();  
     }, 2000 );
});

Hope this helped.希望这有帮助。 ! ！

Edit编辑

Delay function should be like below,延迟功能应该如下所示，

var delay = (function(){
  var timer = 0;
  return function(callback, ms){
    clearTimeout (timer);
    timer = setTimeout(callback, ms);
  };
})();

here i have seen you have hard coded 1000ms that wont work i guess.在这里，我已经看到你硬编码了 1000 毫秒，我猜是行不通的。

控制div的淡出和淡入

问题描述

1 个解决方案

解决方案1
0 2013-12-21 06:16:03

Edit编辑

控制div的淡出和淡入

问题描述

1 个解决方案

解决方案1 0 2013-12-21 06:16:03

Edit编辑

解决方案1
0 2013-12-21 06:16:03