在JS功能之后悬停不起作用

时间:2016-06-04 07:51:39

标签: javascript html css

制作一个有4个答案的问答游戏。 在第一个问题中,选择更正后,悬停(背景颜色)不能处理上一个答案选项(在下一个问题中),同时悬停在其他3个选项上正常工作。如果下一个问题成功,则再次悬停不再处理先前选择的选项。是什么问题????

HTML HERE:

weekNo  Monday      Sunday
1       2015-12-28  2016-01-03
2       2016-01-04  2016-01-10
3       2016-01-11  2016-01-17
4       2016-01-18  2016-01-24
5       2016-01-25  2016-01-31
6       2016-02-01  2016-02-07
7       2016-02-08  2016-02-14
....
12      2016-03-14  2016-03-20
13      2016-03-21  2016-03-27
14      2016-03-28  2016-04-03
15      2016-04-04  2016-04-10
16      2016-04-11  2016-04-17
....

CSS HERE:

<div id="answer-box container">

<div class="row">
  <div id="answer-one" class="answer col-md-4" data-bind="click: function() { answerQuestion(0, $element.id) }">
    <span class="big-text">A. </span><span data-bind="text: getAnswerText(0)" class="anshover"></span>
    </div>
<div id="answer-two" class="answer col-md-4" data-bind="click: function() { answerQuestion(1, $element.id) }">
    <span class="big-text">B. </span><span data-bind="text: getAnswerText(1)"></span>
</div>
</div>

<div class="row">
<div id="answer-three" class="answer col-md-4" data-bind="click: function() { answerQuestion(2, $element.id) }">
    <span class="big-text">C. </span><span data-bind="text: getAnswerText(2)"></span>
</div>
<div id="answer-four" class="answer col-md-4" data-bind="click: function() { answerQuestion(3, $element.id) }">
    <span class="big-text">D. </span><span data-bind="text: getAnswerText(3)"></span>
</div>
</div>

</div>

JS HERE:

.answer:hover {
    text-decoration: none;
    cursor: pointer;
    background: #FF7E00;
}

0 个答案:

没有答案