如果输入由div标记括起来，则禁用字段集的属性将不起作用

Question

bootstrap's disabled property on fieldset is supposed to disable all inputs under that fieldset tag. It works perfectly if input tags are right after fieldset tag or after legend tag. As soon as I insert div tag between fieldset and input then disabled property is not working.

It works for following declaration...

<form id="form">
    <fieldset id="fieldset">
    <legend>User Details</legend>
            <input id="first_name" name="first_name" class="form-control" type="text"/>
    </fieldset>
</form>

But not If I add input inside div tag

<form id="form">
    <fieldset id="fieldset">
    <legend>User Details</legend>
        <div class="col-xs-12 col-sm-6 col-md-4">
            <input id="first_name" name="first_name" class="form-control" type="text"/>
            </div>
    </fieldset>
</form>

Can anyone please suggest how to get around this problem?

Answer 1

First, disabled isn't a property of bootstrap; it is native html.

Second, it appears to work just fine. Are you perhaps using incompatible versions of jQuery/bootstrap?

<form id="form">
    <fieldset id="fieldset" disabled>
    <legend>User Details</legend>
        <div class="col-xs-12 col-sm-6 col-md-4">
            <input id="first_name" name="first_name" class="form-control" type="text"/>
            </div>
    </fieldset>
</form>

Working example: http://jsfiddle.net/remus/LAk6L/

Answer 2

尝试这个：

$("#fieldeset").children().attr("disabled", "disabled");