Question

这是我的jquery代码

$('.input').keyup(function(event){
    update_text(); // $('div').html('blahblah');
})
.blur(function(event){
    $(this).keyup();
    if(confirm('Are you sure?')){
        // do somthing...
    }
});

我的问题是输入模糊时，确认框应该在执行update_text（）;

后显示

但是update_text（）似乎在确认后运行...

如何让它首先执行update_text（），然后显示确认对话框？

Answer 1

这可能太简单了，但它似乎解决了这个问题。

$('.input').keyup(function(event){
  update_text(); // $('div').html('blahblah');
})
$('.input').blur(function(event){
  update_text();
  if(confirm('Are you sure?')){
    // do somthing...
  }
});

Answer 2

实际上你的方法确实在confirm()之前运行，这里的问题是你的浏览器异步重新绘制DOM，即使方法.html()本身是同步的。因此，虽然它看起来并不是第一次在视觉上运行，但确实如此。

例如，更简单的版本将具有相同的功能，这可能因浏览器而异：

＆＃13;

$("div").html("foo");
confirm('Are you sure?');

＆＃13;

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

＆＃13;

解决这个问题的一种方法是Jaromanda X's answer，而不是让浏览器执行此操作。例如：

＆＃13;

$("div").html("foo");
$("div").hide().show(function(){
  confirm('Are you sure?'); 
});

＆＃13;

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

＆＃13;

Answer 3

update_text()发生在keyup事件上，该事件在输入模糊之前触发，因此如果设置正确，则每次用户输入另一个字符时实际发生。

＆＃13;

$('.input').keyup(function(event){
    update_text(); // $('div').html('blahblah');
})
.blur(function(event){
    $(this).keyup();
    if(confirm('Are you sure?')){
        // do somthing...
    }
});

update_text = function() {
  text = $('.input').val();
  $('#text').text(text);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class='input'/>
<div id='text'>

＆＃13;

在确认jquery之前执行功能

3 个答案: