Question

我的HTML -

<div id="test">
  <p contenteditable="true"></p>
  <p contenteditable="true"></p>
  <p contenteditable="true"></p>     
</div>

我的jquery

var typingTimer;                
var doneTypingInterval = 1000;  

$("#test p").each(function() {

   $(this).on('keyup', function() {
    clearTimeout(typingTimer);
    typingTimer = setTimeout(doneTyping, doneTypingInterval);
    });


  $(this).on('keydown', function() {
    clearTimeout(typingTimer);
  });
}


//user is "finished typing," do something
function doneTyping () {
    alert("ready to save");
}

当用户停止输入段落时，我需要执行一些功能。上面的代码似乎不起作用。提前致谢 JSFiddle here

Answer 1

这更好，有效......

var typingTimer;                
var doneTypingInterval = 1000;  

$("#test p").on('keyup', function() {
    clearTimeout(typingTimer);
    typingTimer = setTimeout(doneTyping, doneTypingInterval);
}).on('keydown', function() {
    clearTimeout(typingTimer);
});


//user is "finished typing," do something
function doneTyping () {
    alert("ready to save");
}

Answer 2

您的代码中存在错误，每个代码都没有正确关闭，这就是它无法正常工作的原因。

只需打开控制台，您就会看到错误......

您也可以避免使用每种。

http://jsfiddle.net/etJ3Q/29/

var typingTimer;                
var doneTypingInterval = 1000;

$("#test p")
    .on('keyup', function() {
        clearTimeout(typingTimer);
        typingTimer = setTimeout(doneTyping, doneTypingInterval);
    })
    .on('keydown', function() {
        clearTimeout(typingTimer);
});

//user is "finished typing," do something
function doneTyping () {
    alert("ready to save");
}

Answer 3

您不需要循环，只需将功能直接分配给#test段落

var typingTimer;                
var doneTypingInterval = 1000;  

$("#test p").on('keyup', function() {
clearTimeout(typingTimer);
typingTimer = setTimeout(doneTyping, doneTypingInterval);
});


$("#test p").on('keydown', function() {
clearTimeout(typingTimer);
});

//user is "finished typing," do something
function doneTyping () {
    alert("ready to save");
}

Answer 4

工作here

$("#test p").each(function() {

   $(this).on('keyup', function() {
    clearTimeout(typingTimer);
    typingTimer = setTimeout(doneTyping, doneTypingInterval);
    });


  $(this).on('keydown', function() {
    clearTimeout(typingTimer);
  });
});

Answer 5

如果我们使用jQuery的focusout事件会不会很好。输入段落后，当它失去焦点时，我们可以执行该功能。如果我错了，我很抱歉。如果有人停止输入片刻，则会显示警报。使用焦点我们可以避免这种情况。

$("#test p").focusout(function(){ 
   //$(this).hide(); 
   doneTyping (); 
   //setTimeout(alertHello(),3000); 
   //clearTimeout(); 
});

段落上的键盘和keydown事件不起作用

5 个答案: