0

Webベースのクイズを作成しています。答えを押すと、一番上のカウントを次の数字に変更したいのですが、1 桁スキップし続け、次の数字にジャンプします (I から III ではなく、I から III への ei)。私は何を間違っていますか？

サイト: http://www.carlpapworth.com/friday-quiz/#

HTML:

<ul id="count">
                <li><h4>I</h4></li>
                <li><h4>II</h4></li>
                <li><h4>III</h4></li>
                <li><h4>IV</h4></li>
                <li><h4>V</h4></li>
                <li><h4>VI</h4></li>
                <li><h4>VII</h4></li>
                <li><h4>VIII</h4></li>
                <li><h4>IX</h4></li>
                <li><h4>X</h4></li>
</ul>

JS:

  $('#count li:first').addClass('cCurrent');
        $('.qAnswers li a').click(qNext);
        function qNext(){
          $('.cCurrent').next('#count li').addClass('cCurrent');
          $('.cCurrent:first').removeClass('cCurrent'); 
        }
4

4 に答える 4

4

js/custom.jsスクリプトはで2回言及されてい<head>ます。それらの1つを削除する必要があります。そうしないと、クリックイベントが2回登録されます。

さらに、内部の式.next()はやや奇妙に見え（そこにある必要はなく#count、おそらく偶数ではないかもしれませんli）、関数自体は次のように簡略化できます。

function qNext()
{
    $('#count .cCurrent')
        .removeClass('cCurrent')
        .next('li')
        .addClass('cCurrent');
}

現在強調表示されているクラスを削除して<li>から、次のクラスに移動して、そこにクラス<li>を適用しますcCurrent。

最後に、答えが正しいか間違っているかを示すクラスを答えに与えるべきではありません。あなたの答えは次のようなものでした：

<a href="#" class="qWrong">xxx</a>
<a href="#" class="qCorrect">xxx</a>

誰かがソースを見るとしたら、何をクリックするかは非常に明白です。

于 2013-02-20T07:43:02.207 に答える
2

JavaScript に問題はありませんが、HTML ページに同じスクリプトが 2 回含まれています。クリック イベントが 2 回登録されると、問題が発生する可能性があります。

<script type="text/javascript" src='js/custom.js'></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script src='js/custom.js'></script>
于 2013-02-20T07:46:30.070 に答える
0

qnext 関数は正しく機能しています

問題は、スライダー (ulslide) によって回答に追加された、1 つの質問を右にスライドさせる別のクリック イベントも存在することだと思います。この行をコメントアウトして、機能するかどうかを確認してください

nextButton: '.qAnswers a',
于 2013-02-20T07:46:28.833 に答える