选择单选按钮时隐藏/显示 3 个文本框

我有 2 个单选按钮。选择一个文本框时，我想显示 3 个文本框，并在选择其他文本框时隐藏它。

这是代码。

这是我的 2 个单选按钮。

<input type="radio" name="type"> Fresher

<input type="radio" name="type"> Experienced 

单击经验丰富的单选按钮后，我想显示这 3 个文本框。

Company Name: <input type="text"  hidden="true"/> <br/>
Designation: <input type="text" hidden="true"/> <br/>
Year_of_Experience: <input type="text"  hidden="true"/> <br/>

请帮助我解决这个新的 javascript 问题。

您可以按如下方式执行此操作。首先将您的 HTML 更改为：

<input type="radio" name="type" value="Fresher"> Fresher
<input type="radio" name="type" value="Experienced"> Experienced

<div id="textboxes" style="display: none">
    Company Name: <input type="text" hidden="true"/> 
    Designation: <input type="text" hidden="true"/> 
    Year_of_Experience: <input type="text" hidden="true"/> 
</div>

此代码添加到您的代码中的是为单选按钮提供一个值。这使我们能够根据选择的单选按钮进行选择。其次，输入字段被分组在一起<div>以便轻松隐藏三个输入字段。修改 HTML 后，在您的网站上包含 jQuery 并使用以下代码：

$(function() {
    $('input[name="type"]').on('click', function() {
        if ($(this).val() == 'Experienced') {
            $('#textboxes').show();
        }
        else {
            $('#textboxes').hide();
        }
    });
});

您可以使用 JSFiddle 来了解它是如何工作的：http://jsfiddle.net/pHsyj/ http://jsfiddle.net/pHsyj/