0

我在 JQuery 中绝对是新人，我有以下疑问。

我知道这样做：

$(document).ready(function() {
    DO SOMETHING
    ..............................
    ..............................
    ..............................
}

function()主体实现的行为是在文档完全显示之后执行的。

但例如我有以下情况。进入使用 Struts 2 标签库的页面（但这并不重要，我有一个表单：

<s:form id="projectForm" >
    <sj:div id="resultEvents" href="%{loadFolderTechId}"
            formIds="treeForm"
            class="result ui-widget-content ui-corner-all"
            loadingText=" "
            onBeforeTopics="before"
            onCompleteTopics="complete"
            deferredLoading="true"
            reloadTopics="reloadEvents"
            >
     </sj:div>
     <s:submit style="display:none" id="submitButton" action="projectCreationAction"/>
</s:form>

s:form标签是一个简单地包装标准 HTML 表单的Struts 2标签。

sj:div标签是一个Struts 2标签，它包装了一个包含表单输入字段的 div 。这被定义到另一个 JSP 页面中，并且仅在特定事件之后（当用户单击按钮时）显示。它只是生成一个标准的 HTML div，其中id=resultEvents包含表单输入字段。

所以现在我想对输入字段值使用JQuery验证器，但是当$(document).ready()准备好文档时我无法加载它，因为当文档准备好时，我的表单的输入字段不是加载到 DOM 中。

我必须做这样的事情：

$(document).ready(function(){

    alert("VALIDATION")
    var validator = $("#projectForm").validate({
        rules: {
            "kmProjectInfo.name": "required"
        },
        messages: {
            "kmProjectInfo.name": "Please enter a project name"
        }
    });

但是在加载了具有id=resultEvents的div 的内容之后，我必须加载这个脚本。

我该怎么做？有可能吗？

肿瘤坏死因子

4

1 回答 1

0

想法：

1) 如果您的表单由另一个模块加载（或者在调用 $(document).ready 时），您必须设置回调或调度一个事件，说明表单何时准备就绪。

function validator() {
   var validator = $("#projectForm").validate({
      rules: {
        "kmProjectInfo.name": "required"
      },
      messages: {
        "kmProjectInfo.name": "Please enter a project name"
      }
   });
   ...
}

// form_module can be a module you use to load 
// or a struts2 js api or some jquery function that does the work.
$(document).ready(function() {
  form_module.load("url/to/form?", {
   "on_form_loaded": function() { validator(); }
  })
});

2）当您单击提交或尝试提交表单时定义验证器，但是这样您无法在加载表单时进行验证。

function validator() {
  var validator = $("#projectForm").validate({
     rules: {
       "kmProjectInfo.name": "required"
     },
     messages: {
       "kmProjectInfo.name": "Please enter a project name"
     }
  });

  ...
}

// ?
$("#submitButton").click(function() { validator(); });
// ?
$("#projectForm").submit(function() { validator(); });
于 2015-01-12T18:56:10.430 回答