我正在创建一个网站,我基本上需要查看字符串是否匹配,以便将结果标记为正确(绿色)或错误(红色)。
我遇到的问题是它总是变成红色,即使字符串相同,我也不知道哪里出错了。
这是代码
var checkedButton = getCheckedRadio(document.getElementsByName("answer"));
var id = checkedButton.id;
if(id=="answer1"){
var answer1 = document.getElementById("answer1text");
if(rightAnswer == answer1.innerHTML){
answer1.style.color = "#33FF00";
}
else{
answer1.style.color = "red";
}
}
else if(id=="answer2"){...
我已经使用 alert()
检查了 rightAnswer
和 answer1.innerHTML
,它给出了相同的结果,但它在以下情况下不起作用:我尝试比较它们...也尝试使用 ===
运算符,同样的事情...
HTML 代码编辑
<form>
<div id="left">
<div id="a1">
<input type="radio" name="answer" value="" checked id="answer1">
<label id="answer1text">Odgovor na prvo pitanje</label>
</div>
<div id="a2">
<input type="radio" name="answer" value="" id="answer2">
<label id="answer2text">Odgovor na prvo pitanje</label>
</div>
</div>
<div id="right">
<div id="a3">
<input type="radio" name="answer" value="" id="answer3">
<label id="answer3text">Odgovor na prvo pitanje</label>
</div>
<div id="a4">
<input type="radio" name="answer" value="" id="answer4">
<label id="answer4text">Odgovor na prvo pitanje</label>
</div>
</div>...
编辑 2 - 整个 Javascript
<script language="javascript" type="text/javascript">
var counter = 1;
var split;
var rightAnswer;
function potvrdi(){
counter = getCookie("counter");
if(counter == "")counter = 1;
var potvrdi = document.getElementById("gmedu").innerHTML;
if(potvrdi == "Potvrdi"){
checkAnswer();
document.getElementById("gmedu").innerHTML = "Dalje";
}
else{
alert(counter);
setCookie("counter",(parseInt(counter)+1));
doSplit();
document.getElementById("gmedu").innerHTML = "Potvrdi";
document.getElementById("answer1text").style.color = "black";
document.getElementById("answer2text").style.color = "black";
document.getElementById("answer3text").style.color = "black";
document.getElementById("answer4text").style.color = "black";
}
return false;
}
function setCookie(cname, cvalue) {
document.cookie = cname + "=" + cvalue + "; ";
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1);
if (c.indexOf(name) == 0) return c.substring(name.length,c.length);
}
return "";
}
function doSplit(){
var text = "1.\r\n"+...\\here is a huge string of text
split = text.split(/\b\d+\./);
var split1 = split[counter].split(/\n\w+\)/);
rightAnswer = split1[1];
split1 = randomizeAnswers(split1);
document.getElementById("question").innerHTML = split1[0];
document.getElementById("answer1text").innerHTML = split1[1];
document.getElementById("answer2text").innerHTML = split1[2];
if(split1.length > 3){
document.getElementById("answer3text").innerHTML = split1[3];
document.getElementById("a3").style.visibility = "visible";
}
else
document.getElementById("a3").style.visibility = "hidden";
if(split1.length > 4){
document.getElementById("answer4text").innerHTML = split1[4];
document.getElementById("a4").style.visibility = "visible";
}
else
document.getElementById("a4").style.visibility = "hidden";
}
function randomizeAnswers(split1){
var length = split1.length-1;
var random = (parseInt(Math.random()*length))+1;
var tmp = split1[1];
split1[1] = split1[random];
split1[random] = tmp;
return split1;
}
function checkAnswer(){
var checkedButton = getCheckedRadio(document.getElementsByName("answer"));
var id = checkedButton.id;
if(id=="answer1"){
var answer1 = document.getElementById("answer1text");
console.log(answer1.innerHTML)
console.log(rightAnswer)
if(rightAnswer === document.getElementById("answer1text").value){
answer1.style.color = "#33FF00";
alert("TACNO!");
}
else{
answer1.style.color = "red";
alert("NETACNO!");
}
}
else if(id=="answer2"){
var answer2 = document.getElementById("answer2text");
if(rightAnswer == (answer2.innerHTML))
answer2.style.color = "#33FF00";
else
answer2.style.color = "red";
}
else if(id=="answer3"){
var answer3 = document.getElementById("answer3text");
if(rightAnswer == (answer3.innerHTML))
answer3.style.color = "#33FF00";
else
answer3.style.color = "red";
}
else if(id=="answer4"){
var answer4 = document.getElementById("answer4text");
if(rightAnswer == (answer4.innerHTML))
answer4.style.color = "#33FF00";
else
answer4.style.color = "red";
}
}
function getCheckedRadio(radio_group) {
for (var i = 0; i < radio_group.length; i++) {
var button = radio_group[i];
if (button.checked) {
return button;
}
}
return undefined;
}
</script>
最佳答案
据我所知,这两行有问题
var text = "1.\r\n"+...\\here is a huge string of text
split = text.split(/\b\d+\./);
在 split[1]
中拆分后,不仅是文本,而且还以 \r\n
开头的文本,
但是! 在 html 中,串行间隔符号减少为一个,在您的情况下 innerHTML
将以 \n
开头,这就是为什么您比较 false .
我看到至少有两种方法可以解决这个问题
将拆分表达式更改为
split = text.split(/\b\d+\.\r\n/);
在比较之前替换此符号
rightAnswer.replace(/\r|\n/g,"") == answer1.innerHTML.replace(/\r|\n/g,"")
关于javascript - 字符串与标签文本 JavaScript 的比较,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34143491/