Question

我是网络开发的新手。我正在创建一个新的应用程序，在这里我根据radiobuttonlist的选择设计一个元素不同的表单。例如 - 我有一个radiobutton列表 - 性别和选择是男性和女性。

男性： 表单的下一个元素是textfield Extra Curricular activities：，学生可以输入柔道，空手道等类型。

女性： 表格的下一个元素是下拉菜单课外活动：有舞蹈，芭蕾舞等选项根据上述单选按钮的选择，应显示下一个元素，输入的数据将转换为JSON格式并存储在数据库中。

现在，为了达到这个目的，我将dropdownlist中的相同字段放在一个div中，将textfield放在另一个div中。我使用jQuery分别隐藏和显示div。我希望具有ID和名称的相同文本字段基于两种不同场景中的单选按钮选择而表现不同。

课外活动被用作男孩的文本场和女孩的下拉。最终应将相同元素（文本字段或下拉列表）的值输入数据库 FIDDLE
我做得对吗的代码 -

$(document).ready(function () {    
    $('#id_radio1').click(function () {
        $('#multi_language').hide('fast');
        $('#single_language').show('fast');
    });
    $('#id_radio2').click(function () {
        $('#single_language').hide('fast');
        $('#multi_language').show('fast');
    });
});

HTML

<form>
    <input id="id_radio1" type="radio" name="name_radio1" value="value_radio1" >Single</input> 
    <input id="id_radio2" type="radio" name="name_radio1" value="value_radio2">Multi</input>
    <br />    
    <div id="single_language" style="display:none;">
        <p>One</p>
    </div>
     <div id="multi_language" style="display:none;">
        <p>Two</p>
    </div>


</form>

Answer 1

我之前遇到过这样的事情。您可以使用append()根据单选按钮的选择动态生成元素，也可以根据需要在页面加载和detach()/remove()创建元素。

我命名的函数是在jQuery中。你可以使用相同的javascript等价物。

如何根据单选按钮选择使表单元素的行为不同

1 个答案: