[英]Changing fonts and values in html from javascript
我有一个HTML格式的表单，当我点击按钮时，我想将文本从'冠军联赛琐事'更改为'曼彻斯特'。 它只改变了一秒钟，然后改回'冠军联赛琐事'。 我无法弄清楚为什么要改回来。 有任何想法吗？
<script type="text/javascript" src="quiz.js" ></script>
<body>
<form action="" method="post" onsubmit="return checkscript()">
<h1>Choose a Quiz</h1>
<p><input type="radio" name="Radio" value="1" /><font size="5"
color="#0033CC" id="cl">Champions League Trivia</font><br />
<br />
<input type="radio" name="Radio" value="2" /><font size="5"
color="#CC0000" id="epl">English Premier League Trivia</font><br />
<br />
<input type="radio" name="Radio" value="3" /><font size="5"
color="#660033" id="ll">La Liga Trivia</font><br />
<br />
<input type="submit" name="Submit" value="Go" onclick="quizRun()" /></p>
</form>
<p id="result"></p>
</body>
</html>
这是javascript
function quizRun()
{
var inputs = document.getElementsByTagName("input");
var choice = 0;
if (inputs[0].checked) {
choice = 1;
var cl = document.getElementById('cl');
cl.textContent = 'Manchester';
}
if (inputs[1].checked) {
choice = 2;
}
if (inputs[2].checked) {
choice = 3;
}
}
function checkscript()
{
var inputs = document.getElementsByTagName("input");
for (var i=0, l=inputs.length; i<l; i++) {
if (inputs[i].name === "Radio" && inputs[i].checked) return true;
}
return false;
}
我尝试了你的脚本，我发现了这个：值改变但是表单已经提交，所以页面重新加载并且文本会改变回来。
发生了什么事情，你的按钮是type = "submit" 。 提交表单时，正在重新加载页面并返回原始值。
如果您不想提交表单，只需将“开始”按钮更改为type = "button"
尝试使用cl.innerHTML = 'Manchester';
编辑：
您的表单标记没有任何操作，因此页面可能会刷新，导致原始值返回。 向表单提交事件添加return false或preventDefault将阻止提交表单。
我实际上自己尝试过代码，innerHTML或innerText既不能用于@ben fossen所以这个可以实现的唯一原因是因为值实际上没有变化，但是然后表单提交并重置值
如何防止用户更改HTML或JavaScript中的值
[英]How to prevent the user from changing values in the HTML or the JavaScript
由 Javascript function 更改的数组值在更改 HTML 页面时重置
[英]Array values changed by Javascript function resets when changing HTML pages
初学者HTML和Javascript：将输入滑块的值更改为paragraphField.innerHTML
[英]Beginner HTML and Javascript: Changing input slider values to paragraphField.innerHTML
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.