0

クリックした DIV だけに .toggle() を適用する方法。私の現在のコードは、すべてのトグル div に適用されます。からのコンテンツ間のコードスイッチ<div class="toggled">

バージョン1.4でそれを行う必要があります

誰でも私を助けることができますか？

この私のコード:

<html>
<head>
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="card.css" />

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

<script type="text/javascript">
    $(function() {
        $('#toggle').click("click", function() {
            $('.toggled').toggle();
            return false;
        });
    });

</script>
</head>

<body>


<div class="card">

    <div class="toggled">
    <h3>FRONT 1</h3>
    </div>

    <div class="toggled" style="display:none;">
    <h3>BACK 1</h3>
    </div>

    <a href="#" id="toggle">Switch Text Toggle</a><br/>

</div>


<div class="card">

    <div class="toggled">
    <h3>FRONT 2</h3>
    </div>

    <div class="toggled" style="display:none;">
    <h3>BACK 2</h3>
    </div>

    <a href="#" id="toggle">Switch Text Toggle</a><br/>

</div>

</body>
</html>

前もって感謝します！

4

3 に答える 3

2

IDは一意であるため、アンカーのIDをクラスに変更する必要があります。

次に、次のことを行います。

$(function() {
    $('.toggle').on("click", function() {
        $(this).siblings('.toggled').toggle();
        return false;
    });
});

クリックされたアンカーの兄弟をクラスで見つけて、.toggledそれらを切り替えます。document.ready関数も必要であり、イベントハンドラーにはいくつかのタイプミスがあります。

そして、jQueryの新しいバージョンを使用してください。1.4は時代遅れです。

フィドル

于 2013-03-04T01:55:34.900 に答える
0

に置き換え$('.toggled').toggle();ます$(this).toggle();。.toggle現在、イベントのフォーカスであるコンテナではなく、すべてのコンテナを切り替えるように要求しています。

于 2013-03-04T01:54:51.610 に答える
0

これを試して：

$('.card #toggle').click(function() {
            $('.toggled').toggle();
            return false;
        });
于 2013-03-04T02:46:06.337 に答える