更改段落颜色和文本颜色无效(错误的答案)

时间:2016-01-21 15:25:19

标签: javascript html css

我正在设计一个测验类型页面,要求如下:

4个不同的答案会有一个问题,当用户选择错误答案时,段落颜色和背景颜色应该更改。 和链接应该在再次单击时禁用以前单击的链接不应该打开这是一个示例代码。我试图通过以下方式做到这一点:

    Dim ws As Worksheet
    Dim timeRange As Range

 Set ws = Sheets("Worksheet") 'Name of my worksheet goes here. 
 Set timeRange = ws.Range("D:D")

'input the lower limit and the upper limit of the search range
Dim Start_Time As Variant
Dim End_Time As Variant

Start_Time = InputBox(prompt:="Enter the Start_Time(hh:mm:ss.000)")
End_Time = InputBox(prompt:="Enter the End_Time(hh:mm:ss.000)")


    timeRange.FormatConditions.Add Type:=xlCellValue, Operator:=xlBetween, _
    Formula1:=Start_Time, Formula2:=End_Time

    timeRange.FormatConditions(timeRange.FormatConditions.Count).SetFirstPriority

 With timeRange.FormatConditions(1).Font
    .Color = -16383844
    .TintAndShade = 0
End With
With timeRange.FormatConditions(1).Interior
    .PatternColorIndex = xlAutomatic
    .Color = 13551615
    .TintAndShade = 0
End With
timeRange.FormatConditions(1).StopIfTrue = False


 'Loop to format the rows that contains those time values
 Dim Range_Search As String
For Each c In Range("D:D")
If c.Interior.Color = 13551615 Then
    Range_Search = "A" & c.Row & ":" & "H" & c.Row
    ws.Range(Range_Search).Interior.Color = 13551615
End If
Next c

2 个答案:

答案 0 :(得分:0)

您可以使用:focus:active

.incorrect:focus {background: red; color: #fff;} 
<p><a class="correct"   href="#">Answer-1</a></p>
<p><a class="incorrect" href="#">Answer-2</a></p>
<p><a class="incorrect" href="#">Answer-3</a></p>
<p><a class="incorrect" href="#">Answer-4</a></p>

答案 1 :(得分:0)

这样的事情怎么样?

<html>
<body>
<script>
function handleClick(answerObject) {
    if(answerObject.className.indexOf("incorrect") > -1) {
        document.getElementById("paragraph").style.backgroundColor = "red";
    } else {
        document.getElementById("paragraph").style.backgroundColor = "green";
    }

    setTimeout(function() { document.getElementById("paragraph").style.backgroundColor = '#FFFFFF'; }, 500);
}
</script>

<p id="paragraph" style="padding:2%">
This is a question.... BLA BLA BLA
</p>

<p><a class="correct"   href="#" onclick="handleClick(this);">Answer-1</a></p>
<p><a class="incorrect" href="#" onclick="handleClick(this);">Answer-2</a></p>
<p><a class="incorrect" href="#" onclick="handleClick(this);">Answer-3</a></p>
<p><a class="incorrect" href="#" onclick="handleClick(this);">Answer-4</a></p>

</body>
</html>