更改单选按钮的文本

时间:2014-06-09 20:17:26

标签: javascript jquery radio-button

所以我想在JavaScript中更改单选按钮的文本。 .innerHTML似乎正在更改inspect元素中的值,但它永远不会更改显示的文本Option1a。

<form name="form1" method="post" action="Signup.php">
Username:<input name="CreateUsername" type="text" id="CreateUsername"><p>
Password:<input name="CreatePassword" type="password" id="CreatePassword">
email:<input name="CreateEmail" type="text" id="CreateEmail">
<input type="radio" name="Captcha" value="Option1" id="Option1">Option1a</input><br>
<input type="radio" name="Captcha" value="Option2" id="Option2">Option2a</input><br>
<input type="radio" name="Captcha" value="Option3" id="Option3">Option3a</input><br>
<input type="radio" name="Captcha" value="Option4" id="Option4">Option4a</input><br>
<input type="radio" name="Captcha" value="Option5" id="Option5">Option5a</input><br>
<input type="submit" name="Submit" value="signup">
</form>
<script type="text/javascript">
function CaptchaImg()
{
document.getElementById("CaptchaImg").src=Img;
document.getElementById("Option1").value=Option1;
document.getElementById("Option2").innerHTML = "aab";

}
</script>

<form name="form1" method="post" action="Signup.php"> Username:<input name="CreateUsername" type="text" id="CreateUsername"><p> Password:<input name="CreatePassword" type="password" id="CreatePassword"> email:<input name="CreateEmail" type="text" id="CreateEmail"> <input type="radio" name="Captcha" value="Option1" id="Option1">Option1a</input><br> <input type="radio" name="Captcha" value="Option2" id="Option2">Option2a</input><br> <input type="radio" name="Captcha" value="Option3" id="Option3">Option3a</input><br> <input type="radio" name="Captcha" value="Option4" id="Option4">Option4a</input><br> <input type="radio" name="Captcha" value="Option5" id="Option5">Option5a</input><br> <input type="submit" name="Submit" value="signup"> </form> <script type="text/javascript"> function CaptchaImg() { document.getElementById("CaptchaImg").src=Img; document.getElementById("Option1").value=Option1; document.getElementById("Option2").innerHTML = "aab"; } </script>

2 个答案:

答案 0 :(得分:0)

您需要设置属性。不是元素的innerHTML。如果您使用当前方法,那么当您要执行的操作只是更新/更改value属性时,它将设置整个元素的innerHTML。因此,您的元素是具有Option#ID的输入,其具有名为value的属性。因此,除了value属性之外,您不希望更新元素中的任何其他内容。您可以使用.setAttribute("attribute", "value");属性来执行此操作。

document.getElementById("Option1").setAttribute("value", "The New Value");

答案 1 :(得分:0)

这样做:只需为嵌入单选按钮的每个String添加一个标签组件。并更改

下面的Label.Code的值
form name="form1" method="post" action="Signup.php">Username:
<input name="CreateUsername" type="text" id="CreateUsername">
<p>Password:
    <input name="CreatePassword" type="password" id="CreatePassword">email:
    <input name="CreateEmail" type="text" id="CreateEmail">
    <input type="radio" name="Captcha" value="Option1" id="Option1" onclick="CaptchaImg();" > <label id="lbl">Option1a</label></input>
    <br>
    <input type="radio" name="Captcha" value="Option2" id="Option2">Option2a</input>
    <br>
    <input type="radio" name="Captcha" value="Option3" id="Option3">Option3a</input>
    <br>
    <input type="radio" name="Captcha" value="Option4" id="Option4">Option4a</input>
    <br>
    <input type="radio" name="Captcha" value="Option5" id="Option5">Option5a</input>
    <br>
    <input type="submit" name="Submit" value="signup">
    <script type="text/javascript">
  function CaptchaImg()
 {
 document.getElementById("lbl").innerHTML = "aab";

 }    
 </script>
 </form>