0

同じクラス「z」の複数の入力があります

<input type=text class=z>
<input type=text class=z>
<input type=text class=z>
<input type=text class=z>

そして私のjqueryは

$(document).ready(function(){
    $('.z').blur(function(){
        $('.z').hide();
    });
});

すべての要素にフォーカスを失った場合、これらの要素をすべて非表示にしたいと考えています。しかし、これらの要素のそれぞれに焦点を合わせている間、それらをすべて非表示にしたくありません。問題は、最初の要素を入力した後、次の要素に移動すると自動的に非表示になることです。私は何をすべきか？

4

1 に答える 1

2

$(this).show();現在の要素を表示し、残りの要素を非表示にするために使用します。

$(document).ready(function(){
    $('.z').blur(function(){
        $('.z').hide();
        $(this).show();
    });
});

.notlike を使用して要素を非表示にするために、セレクタから現在の要素を除外できます$('.z').not(this).hide();

$(document).ready(function(){
      $('.z').blur(function(){
            $('.z').not(this).hide();       
      });
});

OPの変更に基づいて編集

要素がフォーカスを失った場合に保存する属性を追加し、それを使用してすべての要素がフォーカスを失ったかどうかを判断できます。

ライブデモ

$(document).ready(function(){
    $('.z').blur(function(){
        $(this).attr('lostFocus', 'true');
        if($('.z').length == $('.z[lostFocus="true"]').length)
             $('.z').hide();
    });
});

以下に示すように、html 要素の属性に引用符を追加してください。

<input type="text" class="z">
<input type="text" class="z">
<input type="text" class="z">
<input type="text" class="z">
于 2013-11-14T07:35:26.960 に答える