gpt4 book ai didi

javascript - 在单击表单按钮后应用时,HTML 样式更改不会保留

转载 作者:搜寻专家 更新时间:2023-10-31 08:22:32 24 4
gpt4 key购买 nike

我正在学习 html 的初学者类(class)。通过javascript,我试图在提交表单时修改表单按钮方面,但该修改会立即恢复。看起来 DOM 或表单被重置了,但我不知道如何解决这个问题。

function validateQuestion1(radio){
document.getElementById("valider1").style.background='green';
myAnswer = false;
for (var i=0;i<radio.length;i++) {
if ((radio[i].checked) && (radio[i].value=="1")) {
myAnswer=true;
}
}
}
    <body>
<form name="question1">
<legend>La première balise présente dans un fichier html doit être:</legend>
<input type="radio" id="choix1" name="Q1" value="0">
<label for="head" id="head1">head</label>
<input type="radio" id="choix2" name="Q1" value="0">
<label for="body" id="head2">body</label>
<input type="radio" id="choix3" name="Q1" value="1">
<label for="!DOCTYPE" id="head3">!DOCTYPE</label>
<input type="radio" id="choix4" name="Q1" value="0">
<label for="html" id="head4">html</label>
<button onclick="validateQuestion1(document.forms.question1.Q1)" id="valider1">Valider</button>
</form>
</body>

最佳答案

你可以阻止表单提交

<form onsubmit="return false;">

这将阻止页面刷新。见下文:

function validateQuestion1(radio){
document.getElementById("valider1").style.background='green';
myAnswer = false;
for (var i=0;i<radio.length;i++) {
if ((radio[i].checked) && (radio[i].value=="1")) {
myAnswer=true;
}
}
}
<body>
<form name="question1" onsubmit="return false;">
<legend>La première balise présente dans un fichier html doit être:</legend>
<input type="radio" id="choix1" name="Q1" value="0">
<label for="head" id="head1">head</label>
<input type="radio" id="choix2" name="Q1" value="0">
<label for="body" id="head2">body</label>
<input type="radio" id="choix3" name="Q1" value="1">
<label for="!DOCTYPE" id="head3">!DOCTYPE</label>
<input type="radio" id="choix4" name="Q1" value="0">
<label for="html" id="head4">html</label>
<button onclick="validateQuestion1(document.forms.question1.Q1)" id="valider1">Valider</button>
</form>
</body>

关于javascript - 在单击表单按钮后应用时,HTML 样式更改不会保留,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57399035/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com