Php 如果选中单选按钮，则显示divs和textbox_Php_Jquery

Php 如果选中单选按钮，则显示divs和textbox

php jquery

Php 如果选中单选按钮，则显示divs和textbox,php,jquery,Php,Jquery,重新提出这个问题。我需要从一个不同的角度来看待它我的老办法如下：首先，我不应该使用单选按钮的点击功能。我需要检查是否选中了单选按钮，然后相应地显示“电子”分区或“厨具项目”分区。如果选中单选按钮选项“两者”，也需要显示两者仅当选中相应电子设备或炊具项目的复选框时，才应显示“电子设备”和“炊具项目”中供用户输入数量的文本框字段有什么意见吗 <html> <head> <script src="jquery-1.11.0.js">

重新提出这个问题。我需要从一个不同的角度来看待它

我的老办法如下：

首先，我不应该使用单选按钮的点击功能。我需要检查是否选中了单选按钮，然后相应地显示“电子”分区或“厨具项目”分区。如果选中单选按钮选项“两者”，也需要显示两者

仅当选中相应电子设备或炊具项目的复选框时，才应显示“电子设备”和“炊具项目”中供用户输入数量的文本框字段

有什么意见吗

<html>
    <head>
        <script src="jquery-1.11.0.js"></script>
        <style>
            div{display:none}
        </style>
    </head>
    <body>
        <form>
         <input type="radio" name="household" id   ="electronics" value="electronics">Electronics<br>
         <input type="radio" name="household" id="cookware" value="cookware">Cookware<br>
          <input type="radio" name="household" id="both"  value="both">Both<br>
        </form>
        <script>
            $(document).ready(function(){
                $(input[type="radio"]).click(function(){
                    $("#electronics").show;
                });
            });
        </script>
        <div id="electronics">
            <input type="checkbox" value="radio" name="radio">Radio &nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text1"><br>
            <input type="checkbox" value="phone" name="phone">Phone&nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text2"><br>

        <div id="cookware-items">
            <input type="checkbox" value="grinder" name="grinder">Grinder&nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text1"><br>
            <input type="checkbox" value="mixer" name="mixer">Mixer&nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text2"><br>
        </div>
    </body>
</html>


div{display:none}
电子

炊具

两者都

$（文档）.ready（函数（）{
$（输入[type=“radio”]）。单击（函数（）{
$（“#电子”）展；
});
});
无线电2000

电话2000

研磨机2000

混合器2000

编辑复选框Cookware对Cookware项目的值

使用jquery隐藏和显示如下所示：

现场演示：


div{display:none}
电子

炊具

两者都

$（文档）.ready（函数（）{
$（'input[name=“Househouse”]”）。单击（函数（）
{
//隐藏2个div
$（'#electronics'）.hide（）；
$（“#厨具项目”）.hide（）；
//按当前复选框显示
var值=$（this.val（）；
如果（值=='both'）{
$（#electronics'）.show（）；
$（“#厨具项目”）.show（）；
}
否则{
$（'#'+value）.show（）；
}
});
});
无线电2000

电话2000

研磨机2000

混合器2000

$（'input[type=“radio”]”）

，同样在HTML ID中必须是唯一的。为什么“不应该使用单击？”讲师认为，通过检查单选按钮是否已选中并相应显示，可以更容易地执行此操作。我只是不知道怎么做！我相信我已经做到了。请下次让我们知道什么时候是家庭作业，不要打开一个新的相同的问题。请参见隐藏而不是禁用的原始答案。定义的函数的else选项不起作用。显示这两个值的if条件有效。有什么提示吗？在这里查看演示：我已经在你的HTML中编辑了一些信息，所以你必须复制所有代码谢谢。我现在也理解了代码及其工作原理。您还知道如何仅在单击所选项目旁边的复选框时才添加显示在div中的文本框吗？不我已经完成了下面的代码，但我需要对其进行编辑，以便在单击复选框时添加每个文本框。

<!DOCTYPE html>
<html>
    <head>
        <script src="jquery-1.11.0.js"></script>
        <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
        <style>
            div{display:none}
        </style>
    </head>
    <body>
        <form>
            <input type="radio" name="household" value="electronics">Electronics<br>
            <input type="radio" name="household" value="cookware-items">Cookware<br>
            <input type="radio" name="household" value="both">Both<br>
        </form>
        <script>
            $(document).ready(function() {
                $('input[name="household"]').click(function() 
                {
                    // Hide 2 divs
                    $('#electronics').hide();
                    $('#cookware-items').hide();

                    // Show by current checkbox
                    var value = $(this).val();
                    if (value == 'both'){
                        $('#electronics').show();
                        $('#cookware-items').show();
                    }
                    else{
                        $('#'+value).show();
                    }
                });
            });
        </script>
        <div id="electronics">
            <input type="checkbox" value="radio" name="radio">Radio &nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text1"><br>
            <input type="checkbox" value="phone" name="phone">Phone&nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text2"><br>
        </div>
        <div id="cookware-items">
            <input type="checkbox" value="grinder" name="grinder">Grinder&nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text1"><br>
            <input type="checkbox" value="mixer" name="mixer">Mixer&nbsp;&nbsp;2000&nbsp;&nbsp;<input type="textbox" name="text2"><br>
        </div>
    </body>
</html>