选择单选按钮时隐藏输入

时间:2013-06-24 16:30:33

标签: javascript jquery html

<input type="radio" name="pay" value="banktransfer"> Bank Transfer <br/>
<input type="radio" name="pay" value="paypal"> PayPal <br/> <br/>

<p><label for="id_account_owner">Owner:</label> <input id="id_account_owner" maxlength="250" name="account_owner" type="text" /></p>
<p><label for="id_account_number">Number:</label> <input id="id_account_number" maxlength="50" name="account_number" type="text" /></p>

如果我在单选按钮中选择paypal,如何创建,则会隐藏字段account_numberaccount_owner

2 个答案:

答案 0 :(得分:2)

您可以使用.change个事件:

$("input[type='radio']").change(function() {
    //Check the value for "paypal", also verify that the radio is checked
    if (this.value == "paypal" && this.checked) {
        $("#account_number, #account_owner").hide();
    } else {
        //I figured you would want to unhide these if paypal isnt checked, here's the else
        $("#account_number, #account_owner").show();
    }
});

答案 1 :(得分:0)

喜欢这个吗?

$("#id_account_number, #id_account_owner").prev('label').andSelf().hide(); //hide them initially if you don't have anything checked by default.

$("input[name='pay']").change(function () {
   var elems = $("#id_account_number, #id_account_owner").prev('label').andSelf().show(); //Get the inputs and their labels
    if (this.value == "paypal")  //check for the value of the radio button selected
        elems.hide(); //hide them

});

Fiddle