Javascript 如果选择特定单选按钮，如何在表单中添加新字段？_Javascript_Php_Jquery_Html

Javascript 如果选择特定单选按钮，如何在表单中添加新字段？

javascript php jquery html

Javascript 如果选择特定单选按钮，如何在表单中添加新字段？,javascript,php,jquery,html,Javascript,Php,Jquery,Html,我想做一个表格，里面有性别的单选按钮。现在有两个单选按钮：男按钮和女按钮当任何用户选择女性时，会出现一个新的单选按钮（选项仅适用于女性），询问她是否是父母的独生子女，然后单击“提交”按钮但当用户选择性别为男性时，则没有显示任何选项（此选项仅适用于女性）…只有提交按钮现在怎么做？我不知道，所以我没有添加代码如果有任何使用其他语言的建议。请告诉我。 <script type="text/javascript"> function maleFemaleCheck() { i

我想做一个表格，里面有性别的单选按钮。现在有两个单选按钮：男按钮和女按钮

当任何用户选择女性时，会出现一个新的单选按钮（选项仅适用于女性），询问她是否是父母的独生子女，然后单击“提交”按钮

但当用户选择性别为男性时，则没有显示任何选项（此选项仅适用于女性）…只有提交按钮

现在怎么做？我不知道，所以我没有添加代码

如果有任何使用其他语言的建议。请告诉我。


<script type="text/javascript">
function maleFemaleCheck() {
    if (document.getElementById('maleCheck').checked) {
        // hide other element
    }
    else {
        // show other element
    }
}
</script>

<input type="radio" onclick="javascript:maleFemaleCheck();" id="maleCheck">Male</input>
<input type="radio" onclick="javascript:maleFemaleCheck();" id="femaleCheck">Female</input>

函数maleFemaleCheck（）{
if（document.getElementById（'maleCheck'）.checked）{
//隐藏其他元素
}
否则{
//显示其他元素
}
}
男性
女性

若要执行预期操作，您可能希望在单击任何特定收音机时添加某些元素，您可以使用事件“onclick”来执行此操作。您还可以将表单包含在父元素中，例如

div

，以便以后可以使用

appendChild

元素。例如，尝试运行以下代码：

HTML:

<!DOCTYPE html>
<html lang="en-US">
    <head>
        <title>####</title>
        <meta charset="UTF-8">
        <link rel="stylesheet" type="text/css" href="css.css">
    </head>
    <body>
        <div id="container">
            <label for="female">FEMALE: </label>
            <input type="radio" name="gender" id="female" onclick="makeRadio(parentElement);"><br />
            <label for="male">MALE: </label>
            <input type="radio" name="gender" id="male"><br />
        </div>
        <script type="text/javascript" src="javascript.js"></script>
    </body>
</html>

现在，类似地，您可以找到一种添加更多元素的方法，只是不要一次又一次地重复此代码。这只是一个例子

方式2：

如果不想添加元素，可以将它们包含在标记中，但可以使用CSS隐藏它们。使用类似于：

函数showElement（）{
if（document.getElementById（“#复选框的id”）.checked）
//显示隐藏复选框
}

我也可以帮忙

希望有帮助：）

我已经使用jQuery完成了这项工作。以下是完整的代码：

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function () {
    $(".text").hide();
    $("#r1").click(function () {
        $(".text").show();
    });
    $("#r2").click(function () {
        $(".text").hide();
    });
});
</script>

<form action="">
<input type="radio" name="gender" id="r1" value="female" onClick="getResults()">Female&nbsp;
<input type="radio" name="gender" id="r2" value="male">Male
<div class="text">
<br>Are you the only child?<br>
<input type="radio" name="only" value="yes" onClick="getResults()">Yes&nbsp;
<input type="radio" name="only" value="no">No
</div>
<br><br><input type="submit" value="Submit">
</form>


$（文档）.ready（函数（）{
$（“.text”）.hide（）；
$（“#r1”）。单击（函数（）{
$（“.text”）.show（）；
});
$（“#r2”）。单击（函数（）{
$（“.text”）.hide（）；
});
});
女性
男性

你是唯一的孩子吗？

对
不

首先自己尝试，然后通过发布您的代码来询问我不知道如何做…因此我如何发布我的代码..使用JQuery onClick事件在单击女性单选按钮时显示和隐藏显示新单选按钮的元素。尝试使用jQuery html根据单选按钮的onClick动态创建单选按钮

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function () {
    $(".text").hide();
    $("#r1").click(function () {
        $(".text").show();
    });
    $("#r2").click(function () {
        $(".text").hide();
    });
});
</script>

<form action="">
<input type="radio" name="gender" id="r1" value="female" onClick="getResults()">Female&nbsp;
<input type="radio" name="gender" id="r2" value="male">Male
<div class="text">
<br>Are you the only child?<br>
<input type="radio" name="only" value="yes" onClick="getResults()">Yes&nbsp;
<input type="radio" name="only" value="no">No
</div>
<br><br><input type="submit" value="Submit">
</form>