链接动态单选按钮HTML Javascript_Javascript_Button_Dhtml_Radio

链接动态单选按钮HTML Javascript

javascript button

链接动态单选按钮HTML Javascript,javascript,button,dhtml,radio,Javascript,Button,Dhtml,Radio,全部, 我曾经使用过这个网站几次，并有一些很好的回复，所以希望有人能再次帮助。我想要一组单选按钮，这样当你点击一个按钮时，你会在它下面得到另一组。再次，当您单击第二组按钮中的一个时，您将看到第三组按钮，等等。目前我有以下内容： <html> <head> <title>My Wizard</title> <script language="javascript"> function Display(question)

全部,

我曾经使用过这个网站几次，并有一些很好的回复，所以希望有人能再次帮助。我想要一组单选按钮，这样当你点击一个按钮时，你会在它下面得到另一组。再次，当您单击第二组按钮中的一个时，您将看到第三组按钮，等等。目前我有以下内容：

<html>
<head>
<title>My Wizard</title>

    <script language="javascript">

    function Display(question) {
            h1=document.getElementById("yes");
            h2=document.getElementById("no");
            h3=document.getElementById("dk");
            h4=document.getElementById("yes2");

                if (question=="yes") h1.style.display="block";
                    else h1.style.display="none";
                if (question=="no") h2.style.display="block";
                    else h2.style.display="none";
                if (question=="dk") h3.style.display="block";
                    else h3.style.display="none";
                if (question=="yes2") h4.style.display="block";
                    else h4.style.display="none";
                                }
    </script>


</head>

<body>

    <hr>
        <form name="form1">
        <p>Do you like the colour blue?</p>

            <input type="radio" name="type" value="yes" checked
            onClick="Display('yes');">
            Yes

            <input type="radio" name="type" value="no"
            onClick="Display('no');">
            No

            <input type="radio" name="type" value="dk"
            onClick="Display('dk');">
            Don't know

<br>

<div ID="yes" style="display:none;">

    <hr>
        <p>Do you like the colour red?</p>

            <input type="radio" name="type" value="yes2" checked
            onClick="Display('yes2')">
            Yes

            <input type="radio" name="type" value="no2"
            onClick="Display('no2');">
            No

</div>

<div ID="yes2" style="display:none">
I want this to appear beneath the 2nd set of buttons, not replacing it!
</div>

<div ID="no2" style="display:none">
test2
</div>


<div ID="no" style="display:none">
<b>this is my no box:</b>
<input type="text" name="no" size="25">
</div>

<div ID="dk" style="display:none">
<b>dk:</b>
<input type="text" name="dk" size="15">
</div>

</form>
</body>
</html>


我的巫师
功能显示（问题）{
h1=document.getElementById（“是”）；
h2=document.getElementById（“否”）；
h3=document.getElementById（“dk”）；
h4=document.getElementById（“yes2”）；
如果（问题==“是”）h1.style.display=“块”；
else h1.style.display=“无”；
如果（问题==“否”）h2.style.display=“块”；
else h2.style.display=“无”；
如果（问题==“dk”）h3.style.display=“block”；
else h3.style.display=“无”；
如果（问题==“yes2”）h4.style.display=“block”；
else h4.style.display=“无”；
}

你喜欢蓝色吗
对
不
不知道



你喜欢红色吗
对
不
我希望它出现在第二组按钮下面，而不是替换它！
测试2
这是我的信箱：
丹麦：

因此，基本上，我正在尝试制作一个小向导，它会问用户一个问题，并基于此，它会问他们另一个问题。我不想使用服务器端应用程序，所以我尝试这样简单的方法——但每当用户从第二组按钮中选择一个选项时，它所附带的文本就会替换第二组按钮。我做错了什么

请再次选择“是”和“是”以了解我的意思。任何帮助都将不胜感激

Joe

无线电输入元素按其

名称

属性分组。您应该为其他无线电输入元素集指定不同的名称

可视示例：

[x] name=favColor   [ ] name=favRed
[ ] name=favColor   [x] name=favRed
[ ] name=favColor   [ ] name-favRed

另请参阅：

如果您的

语句错误，请参阅。您一次又一次地问：if（question==“yes”）h1.style.display=“block”；
else h1.style.display=“无”和第二次if为非真，因此您将h1设置为隐藏
这里有一个解决方案：
<html>
<head>
<title>My Wizard</title>

<script language="javascript">

function Display(question, i) {
        h1=document.getElementById("yes");
        h2=document.getElementById("no");
        h3=document.getElementById("dk");
        h4=document.getElementById("yes2");

        if(i==1){
            if (question=="yes") h1.style.display="block";
                else h1.style.display="none";
            if (question=="no") h2.style.display="block";
                else h2.style.display="none";
        }else if(i==2){
            if (question=="dk") h3.style.display="block";
                else h3.style.display="none";
            if (question=="yes2") h4.style.display="block";
                else h4.style.display="none";
        }
}
</script>


</head>

<body>

    <hr>
    <form name="form1">
    <p>Do you like the colour blue?</p>

        <input type="radio" name="type" value="yes" checked
        onClick="Display('yes', 1);">
        Yes

        <input type="radio" name="type" value="no"
        onClick="Display('no', 1);">
        No

        <input type="radio" name="type" value="dk"
        onClick="Display('dk', 1);">
        Don't know

<br>

<div ID="yes" style="display:none;">

<hr>
    <p>Do you like the colour red?</p>

        <input type="radio" name="type" value="yes2" checked
        onClick="Display('yes2', 2)">
        Yes

        <input type="radio" name="type" value="no2"
        onClick="Display('no2', 2);">
        No

</div>

<div ID="yes2" style="display:none">
I want this to appear beneath the 2nd set of buttons, not replacing it!
</div>

<div ID="no2" style="display:none">
test2
</div>


<div ID="no" style="display:none">
<b>this is my no box:</b>
<input type="text" name="no" size="25">
</div>

<div ID="dk" style="display:none">
<b>dk:</b>
<input type="text" name="dk" size="15">
</div>

</form>
</body>
</html>


我的巫师
功能显示（问题一）{
h1=document.getElementById（“是”）；
h2=document.getElementById（“否”）；
h3=document.getElementById（“dk”）；
h4=document.getElementById（“yes2”）；
如果（i==1）{
如果（问题==“是”）h1.style.display=“块”；
else h1.style.display=“无”；
如果（问题==“否”）h2.style.display=“块”；
else h2.style.display=“无”；
}else如果（i==2）{
如果（问题==“dk”）h3.style.display=“block”；
else h3.style.display=“无”；
如果（问题==“yes2”）h4.style.display=“block”；
else h4.style.display=“无”；
}
}

你喜欢蓝色吗
对
不
不知道



你喜欢红色吗
对
不
我希望它出现在第二组按钮下面，而不是替换它！
测试2
这是我的信箱：
丹麦：
什么样的名字叫“yes2”？应该是“找不到文件”。这正是我想要的！非常感谢你。我对Javascript非常陌生，所以这需要一段时间。绝对完美的回应。在大多数情况下，如果在顶部框中单击“是”，然后在第二个框中单击“是”，然后返回第一个框并单击“否”-则会在第一个问题下方出现第二个响应框。那容易修理吗？是的。你有一个if，如果这个条件得到满足，事情就会发生。现在您只需将内容设置为可见，因此只需添加一行来隐藏其他内容。几乎是一个模板if（条件）{hX.style.display=“block”hY.style.display=“none”}或者{hY.style.display=“block”hX.style.display=“none”}
或者类似的东西。一般来说，只要想一想，如果条件满足，你希望发生什么。另一种方法是将其分成两个功能（如果块变大，建议使用）