Question

这里我在我的页面中使用相同的地址选项当我点击相同地址的复选框时，我的其他输入必须禁用我的代码：

<ul><input type="checkbox" name="same-address" /> Click for same address <br />Enter Address here: <input type="text" name="address" /> Enter City here: <input type="text" name="city" /> </ul>

Answer 1

您可以使用 attribute equals selector 按类型选择输入，并使用.prop更新disabled的{{1}}状态：

input

<强> Fiddle Demo

Answer 2

试试这个

    $('#same').click(function () {
    if ($(this).is(':checked')) {
        $(this).parents('ul').find('li input[type="text"],select').attr('disabled', 'disabled');
    } else {
        $(this).parents('ul').find('li input[type="text"],select').removeAttr('disabled')
    }
});

DEMO Fiddle

Answer 3

您可以使用input selector选择所有输入元素，并使用Prop来禁用控件。

 $('input[type="checkbox"]').click(function() {
        $('input[type="text"]').prop('disabled',this.checked);
    })

Answer 4

请尝试使用以下代码段。

<!DOCTYPE html>
<html>
<head> 
<title>Test</title>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
<script>
$( document ).ready(function() {  
      $('.SameAsBillingAddress').on('click',function(){

        if($(this).prop('checked'))
        {
            $('.Address2').prop('disabled', true);
        }
        else
        {
            $('.Address2').prop('disabled', false);
        }
       });

}); 

</script>

</head>
<body>
<div>
<ul>
    <div style="height:30px; width:80%; margin-left:30px; clear:both;">
        <input name="" type="checkbox" value="" class="SameAsBillingAddress" />Same as Billing Address</div>
    <li>
        <label>House No.:</label>
        <input type="text" name="house no" class="Address2" placeholder="House No" />
    </li>
    <li>
        <label>Street:</label>
        <input type="text" name="street" class="Address2" placeholder="Your Street" />
    </li>
    <li>
        <label>City</label>
        <input type="text" name="city" class="Address2" placeholder="Your City" />
    </li>
    <li>
        <label>Zip:</label>
        <input type="text" name="zip" class="Address2" placeholder="Your Zip" />
    </li>
    <li>
        <label>Country:</label>
        <select class="Address2">
            <option>India</option>
        </select>
    </li>
    <li style="float:right;">
        <label></label>
        <input type="submit" name="save" class="Address2" value="Save Details" />
    </li>
</ul>
</div>

</body>
</html>

单击复选框按钮时，禁用所有输入类型值

4 个答案: