javascript - 选择单选按钮时隐藏输入

Question

<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_number并将account_owner被隐藏，如何创建？

Answer 1

您可以使用.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();
    }
});

Answer 2

像这样？

$("#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

});

小提琴