1

コード：

<script type="text/javascript">
$(document).ready(function() {
    $("#clicker").click(function() {
        $(".show_this").show();
        e.preventDefault();
    });
});
</script>

上記のスクリプトを使用すると、#clicker をクリックすると .show_this を表示できますが、もう一度 #clicker をクリックすると非表示にしたいと思います。それを行うためにコードを微調整するにはどうすればよいですか?

私はいくつかの調査を行いましたが、使用e.preventDefault();することでそれを達成できるように見えましたが、うまくいきませんでした.

4

3 に答える 3

4

使用できますtoggle();

$(".show_this").toggle();

これは毎回トグルするため、非表示の場合は表示され、その逆も同様です

API ドキュメント: http://api.jquery.com/toggle

もevent.preventDefault();これを行うことはできませんが.show-this、リンクをたどるというデフォルトのアクションが妨げられるため、 がアンカー タグである場合に便利です。

于 2013-09-04T17:23:15.977 に答える
3

.toggle()代わりに使用してください。

$(document).ready(function() {
    $("#clicker").click(function(e) {
        $(".show_this").toggle();
        e.preventDefault();
    });
});

jsFiddle の例

于 2013-09-04T17:23:13.937 に答える
2

.toggle()次のような方法を使用してこれを行うことができます。

$(document).ready(function() {
    $("#clicker").click(function(e) {  // call the event variable 'e' first here
        e.preventDefault();
        $(".show_this").toggle();            
    });
});
于 2013-09-04T17:23:35.717 に答える