Question

我一直在寻找没有成功的时间。我想检测特定的jquery ui对话框何时失去焦点。我知道我可以检测到它何时获得焦点：

focus: function(event, ui) { console.log('focus in: '+this.id); }

然而，焦点输出事件不会以我尝试过的任何方式触发：

focusout: function(event, ui) { console.log('focus out: '+this.id);}

这是我的（PHP echo'ed）代码：

<script type=\"text/javascript\">
$(\"".$element."\").click(function(e){
    $(\"#".$divname."\").load('".$url."').dialog({
    title: '".$title."',
    modal:".$modal.", 
    resizable: true, 
    width:'".$width."', 
    height:'".$height."', 
    show: 'clip',
    hide: 'clip',
    open: function(event, ui) {\$(\".ui-widget-overlay\").css({'background-image': 'url(\"../css/stripe_small.png\")','background-repeat':'repeat', 'opacity':'0.8'})},
    minimize: '#toolbar',
    focus: function(event, ui) { console.log('focus in: '+this.id); },
    focusout: function(event, ui) { console.log('focus out: '+this.id);}});
    });
</script>
<div id=\"".$divname."\"></div>";

除了焦点检测之外，一切都很好。有没有办法做到这一点，或者我是否必须迭代所有窗口元素以找出哪个具有焦点？

编辑：或者，我想知道我是否可以找到前面的那个UI对话框。

Answer 1

由于没有人回答，我会简单回答一下我的想法。 jQuery的模糊和 focusout 似乎没有触发我的对话框：

尝试侦听对话框小部件的事件时：

$(".ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-draggable.ui-resizable").blur(function({ //NOP });

尝试侦听用于对话框的divname的事件时：

$("#divname").blur( function({ //NOP });

不要被触发。奇怪的是， focusin 确实有效：

$("#divname").focusin( function({ console.log('focused in'); });

一个hackish解决方案（如果页面上有很多ui对话框可能会有点沉重，因为在我的情况下会发生这种情况，但是仍然有效，就是在ui对话框上监听点击事件：

$(".ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-draggable.ui-resizable").live('click',function(){
  $(this).addClass('ui-active').removeClass('ui-inactive');
});

这恰恰相反：不是试图检测失去焦点的对话框，而是单击所有对话框。具有最高ZIndex的那个位于顶部，其余的不是（因此失去焦点）：

var topZindex = 0;
$(".ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-draggable.ui-resizable").each( function( ){
  var thisZindex = parseInt($(this).css('zIndex'), 10);
  if ( thisZindex > topZindex ) topZindex = thisZindex;
});

如果在整个ui对话框失去焦点时以某种方式触发回调将会非常好，但我似乎无法在网络上找到另一种解决方案，并且我无法模糊或聚焦触发。

jquery ui对话框如何检测失去焦点

1 个答案: