【问题标题】:What is wrong with my body-click event?我的身体点击事件有什么问题?
【发布时间】:2012-04-13 17:50:34
【问题描述】:

我有那个文本字段:

<input type='text' id='title' name='title'>
<div id='error' class='error'></div>

当用户点击文本框外出现验证问题时,出现div“错误”。

我想要做的是在用户单击正文中的任何位置时隐藏那个小 div。 我在 body click 事件中尝试了 e.stopPropagation 但没有奏效。

div 永远不会出现,因为当我模糊文本字段时,它被认为是身体点击

如果您有任何想法,请告诉我。问候

编辑: 我已经更新了代码。正文单击事件中的代码应该在单击文本字段以外的任何内容时隐藏“错误” div,但无法使其正常工作。

$('body').click(function(event){
        if ($(event.target).closest('#title').get(0) == null ) { 
            $("#error").hide(); 
            }});

// Validation
$('#title').blur(function(){
    var titleinput=$('#title').val();
    if (titleinput.length <30 || titleinput.length >50){
        $('#error').text('Your title must be between 30 and 50 characters').show();
        }
    });

【问题讨论】:

  • 小编辑:在错误 div 的名称上犯了一个小错误。问题还是一样。
  • "Anywhere in body" 是整个可点击的网页。包括&lt;input&gt;。页面中没有任何地方可供用户单击不是&lt;body&gt;。改变你的要求。
  • 您的正文点击处理程序没有正确关闭,但我猜这是一个错字?
  • 嗨,是的。感谢您的回复。我现在正在编辑帖子

标签: javascript jquery


【解决方案1】:

很遗憾,由于blurclick 是不同的事件,您不能使用stopPropagation。我能想到的唯一方法就是伪造它。您可以忽略在blur 事件的几分之一秒内发生的第一次点击。

http://jsfiddle.net/LeNDp/1

var ignoreClicks = false;
var timer;

$("body").click(function() {
    if(!ignoreClicks){
        $("#msg").fadeOut();
    }else{
        if(timer) clearTimeout(timer);
        ignoreClicks = false;        
    }
});

$("input").blur(function(e) {
    ignoreClicks = true;      
    $("#msg").stop(true,true).show();

    if(timer) clearTimeout(timer);
    timer = setTimeout(function(){ignoreClicks=false;}, 250);
});​

【讨论】:

  • 您好,非常感谢您的留言。那是为我做的。问候
  • 你怎么知道blur会在click之前触发?是在 jQuery 的文档中吗?
  • @CrazyJugglerDrummer 实际上我不确定这是否得到保证。根据我的经验,我认为情况就是这样。它不会出现在 jQuery 文档中,它可能取决于浏览器。
猜你喜欢
  • 2012-09-07
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-01-16
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多