0

我正在做一个基于网络的测验。当我按下一个答案时，我希望顶部的计数更改为下一个，但是它一直跳过一个数字，跳到下一个数字（ei 从 I 到 III，而不是 I 到 III）。我究竟做错了什么？

网站： 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脚本在. _ <head>您应该删除其中一个，否则点击事件会注册两次。

此外，里面的表达式.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 页面包含两次相同的脚本。如果点击事件注册了两次，它可能会导致您的问题。

<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

我对 jquery 的细节不太熟悉，但我会通过添加一些跟踪来调试它，内在的精神：

function qNext(){
    // Output data on what is your current question
    $('.cCurrent').next('#count li').addClass('cCurrent');
    // Output something - so you know for sure that this is the line that does the double move
    $('.cCurrent:first').removeClass('cCurrent'); 
}

你也可以尝试：

function qNext(){
    // Output ...
    $myObject = $('.cCurrent');
    // Output ...
    $myObject2 = $myObject.next('#count li');
    // Output ...
    $myObject2.addClass('cCurrent');
    // Output ...
    $('.cCurrent:first').removeClass('cCurrent'); 
}
于 2013-02-20T07:45:19.837 回答
0

qnext 功能正常工作

我假设问题是还有另一个点击事件，它也向右滑动一个问题，通过滑块（ulslide）添加到答案中。尝试注释掉这一行，看看它是否有效

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