5

同じボタンのフェードインイベントを発生させるためにJQuery関数を呼び出そうとしていidますが、ブラウザの最初のボタンだけがイベントを発生させることができます。

これは、 の付いたボタンを「フェードイン」する JQuery 関数Id="skip"です。をクリックするbutton(Id="next")と、他button(Id=skip)がフェードインします。

$(document).ready(function () {
    $('button[id^="next"]').click(function () {
        $("#skip").hide().fadeIn(5000);
    });
});

これがボタンですid="next"

 <button id="next" type="submit" value="2" name="submit">Next</button>

そして、これはボタンですid="skip"

<div id="skip">
<form method="post" >
<input type="hidden" id="skip_ig" name="skip_ig" value=""></input>
<div id="fade"><button type="submit" value="3" name="submit">Skip >></button></div>
<?php include('includes/aftersubmit.php');
</form>
</div>

これらの「次へ」と「スキップ」のボタンが複数あります。ただし、最初の「スキップ」ボタンのみがフェードインし、他のボタンはフェードインしません。同じボタンが複数ある場合、Jquery関数は最初のボタンのみを呼び出すことができますidか? ご協力ありがとうございました。

4

3 に答える 3

20

属性の使い方が間違っています。ID 属性は1 回だけ使用し、一意にする必要があります。同じ識別子を持つ複数のインスタンスが必要な場合は、クラス属性を使用する必要があります。

id="next"

あなたが持っている必要があります

class="next"

次に、クラスセレクターを次のように使用します

$(".next").click( function() {
    ...
});

そして、それはそれらすべてで機能するはずです

于 2013-06-12T18:21:49.867 に答える
1

たぶん、このようなものがあなたが望むものです:

<button class="next" type="submit" value="2" name="submit">Next</button>
<div class="skip">
    <form method="post" >
        <input type="hidden" class="skip_ig" name="skip_ig" value=""></input>
        <div class="fade"><button type="submit" value="3" name="submit">Skip >></button> </div>
        Stuff here
    </form>
</div>


$(document).ready(function () {
    $('button[class^="next"]').click(function () {
        $(this).next($(".skip")).hide().fadeIn(5000);
    });
});

http://jsfiddle.net/tHcan/

于 2013-06-12T18:29:40.923 に答える