大体思路是:
用户点击“确定”按钮后对用户的选择进行判断,并把判断的结果放在一个div标签里(设置innerHTML属性)。
我在document.getElementById("answer1").innerHTML = "你的答案是【" + document.form.rd[ix].value + "】" + "正确!";后面加了一句alert,为的就是让程序执行到这个地方的时候停下来。我发现当alert对话框弹出的时候,innerHTML设置的内容正常显示出来了。但把alert关掉后,刚刚显示出的文字就消失了!!好像是又被擦除了一样!这是怎么回事
文字正常显示出来了
点确定后文字消失!
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html;charset=gb2312" /> <title>回答问题</title> </head> <body> <script type="text/javascript"> function judge(q) { switch(q) { case 1: { for(var ix = 0 ; ix < document.form.rd.length ; ++ ix) { if(document.form.rd[ix].checked) { if("2" == document.form.rd[ix].value) { document.getElementById("answer1").innerHTML = "你的答案是【" + document.form.rd[ix].value + "】" + "正确!"; alert("2"); } else { document.getElementById("answer1").innerHTML = "你的答案是【" + document.form.rd[ix].value + "】" + "错误~"; alert("3"); } } } break; } } } </script> <p>1 + 1 = ?</p> <form name="form"> <label><input type="radio" name="rd" value="1" />1</label> <label><input type="radio" name="rd" value="2" />2</label> <label><input type="radio" name="rd" value="3" />3</label>     <button onclick="judge(1)">确定</button> <br /> <div id="answer1"></div> </form> </body> </html>
------解决方案--------------------
将
- HTML code
<button onclick="judge(1)">确定</button>