1

私はそのテキストフィールドを持っています：

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

ユーザーがテキストフィールドをクリックして検証に問題がある場合、div「エラー」が表示されます。

私がやりたいのは、ユーザーが体のどこかをクリックしたときにその小さなdivを非表示にすることです。ボディクリックイベントでe.stopPropagationを試しましたが、機能しませんでした。

テキストフィールドからぼかした場合、ボディクリックと見なされるため、divは表示されません。

何かアイデアがあれば教えてください。よろしく

編集：コードを更新しました。body clickイベント内のコードは、テキストフィールド以外がクリックされたときに「エラー」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();
        }
    });
4

1 に答える 1

3

残念ながら、blurとclickは別のイベントであるため、 は使用できませんstopPropagation。これを行うために私が考えることができる唯一の方法は、それを偽造することです。イベントの数分の 1 秒以内に発生する最初のクリックは無視できます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);
});​
于 2012-04-13T18:05:58.590 に答える