Question

我有一个div

 <div id="form"/>

有些JS正在从这个div中构建一个表单。

结果如

 <div id="form"> 
     <fieldset>
             ..inputs
     </fieldset>
     <fieldset>
             ..inputs
     </fieldset>
     <fieldset>
             ..inputs
     </fieldset> 
 </div>

表单构建完成后，我需要运行此脚本

$(":input","fieldset:eq(2)").addClass("readonly-form");
$(":input","fieldset:eq(2)").removeClass("txt_textarea");

问题是，当我将这些脚本放在构建表单的代码后面时，字段集尚未构建。

我无法在JS代码中添加一个类附加到字段集，该代码正在构建表单。

有没有办法等到表单生成然后添加和删除css？

这不起作用

  $(function(){
        var form = new Form("@Model.Name");
        form.AdditionalConfigUrlParams += "isshow=uloha"
        form.Create(@Html.Raw(Model.Data));

        $(":input","fieldset:eq(2)").addClass("readonly-form");
        $(":input","fieldset:eq(2)").removeClass("dhxlist_txt_textarea");

    });

Answer 1

如果你的表单创建者有一个完整的事件你可以把它放在那里，否则你可能想看看livequery plugin

    $('form').livequery(function() {
        $(":input","fieldset:eq(2)").addClass("readonly-form");
         $(":input","fieldset:eq(2)").removeClass("txt_textarea");
   }

Answer 2

我认为你可以使用

$(document).ready(function(){
    $(":input","fieldset:eq(2)").addClass("readonly-form");
    $(":input","fieldset:eq(2)").removeClass("txt_textarea");
});

Answer 3

你的jQuery选择器不对。它应该是：

$(":input, fieldset:eq(2)").addClass("readonly-form");// removed quotes between selectors
$(":input, fieldset:eq(2)").removeClass("txt_textarea");// same here

此外，这只会选择最后一个字段集。

Answer 4

你可以检查表格是否已经创建

var formReady=form.create(@Html.Raw(Model.Data); // IDK what plugin you r using to create a form
if(formReady) {
 $(":input,fieldset:eq(2)").addClass("readonly-form").removeClass("dhxlist_txt_textarea");
}

或尝试使用@mcgrailm方法

在从JS脚本创建元素后添加css类

4 个答案: