0

テキストエリアと送信ボタンがあります。ユーザーがテキストエリアの外側をクリックすると、スクリプトが実行され、テキストエリアに何もない場合は、送信ボタンが非表示になります。ただし、送信ボタンをクリックするとアクションが実行され、ボタンが非表示になるため、テキストエリアの外側をクリックすると、このようになりたくありません。すべきではありません。したがって、ユーザーがテキストエリアのラッパーdivの外側をクリックして送信ボタンをクリックし、スクリプトを実行するタイミングを検出する必要があります。

 <div class="wrapper">
     <textarea class="textarea"></textarea>
     <input type="submit" class="submit" value="submit"/>
 </div>
4

2 に答える 2

1

イベントの「target」プロパティを確認してください。これにより、実際にクリックされた要素がわかります。次に、条件ステートメントを実行して、送信ボタンがイベントをディスパッチしなかったことを確認できます。

jQueryドキュメント：http ：//api.jquery.com/event.target/

Mozillaドキュメント：https ：//developer.mozilla.org/en-US/docs/DOM/event.target

于 2012-08-20T03:24:06.157 に答える
0

このようなもの：

$(document).ready(function() {
    var $text = $("textarea.textarea"),
        $btn = $("input.submit");
    $(document).click(function(e) {
        if (!$text.is(e.target) && !$btn.is(e.target) && $text.val() == "")
            $btn.hide();
        else
            $btn.show();
    });
});

event.targetつまり、クリックイベントはドキュメントにバブルアップしますが、ドキュメントが受信するクリックイベントで、クリックがテキストエリアまたはボタン以外の場所にあるかどうかをテストし、最初にクリックされた要素をで判別できることを念頭に置いてください。textareaが空の場合、ボタンを非表示にします。それ以外の場合は表示します。

デモ： http： //jsfiddle.net/HpmDF/

クラスを使用して個々のコントロールを識別することは最善の計画ではないことに注意してください。それがidの目的です。複数のテキストエリアと関連するボタンが存在する可能性がある場合は、別のソリューションが必要になります。

PS「クリック」について明示的に質問したことにも注意してください。これは私が提供したものですが、ユーザーがキーボードを介してタブアウトできるようにする必要があります...

于 2012-08-20T03:30:09.440 に答える