1

背景：我有一个 jQuery 验证脚本，它几乎用于我所有的网页，允许客户端验证（我也做服务器端验证）。除了每个表单的特定“规则”之外，我所有页面的 javascript 都是相同的。

在呈现 HTML 页面之前，每个页面的规则都从我的控制器插入到 php 变量 $jquery_validation 中。这意味着我可以使用适当的客户端验证规则动态生成每个 html 页面和表单。

以下是我的所有 html 页面上当前加载的 javascript 代码：

$(document).ready(function(){
      $('#signupform').validate({
           wrapper: 'span class="error"',
           meta: 'validate', 
           highlight: function(element, errorClass, validClass) {
               if (element.type === 'radio') {
                      this.findByName(element.name).addClass(errorClass).removeClass(validClass);
              } else {
                      $(element).addClass(errorClass).removeClass(validClass);
               }

              var error = $(element).parent().find('span.error');       
                error.show();     
            },

             unhighlight: function(element, errorClass, validClass) {
              if (element.type === 'radio') {
                this.findByName(element.name).removeClass(errorClass).addClass(validClass);
              } else {
                $(element).removeClass(errorClass).addClass(validClass);
              }

              $(element).parent().find('span.error').hide(0, function() {
                $(element).parent().find('span.valid').fadeIn(200);
              });
            },
            <?=$jquery_validation?>);});

</script>

最后的 $jquery_validation 变量包含每个页面的“规则”，这些规则明显不同，具体取决于表单。它给出的输出示例是：

 "rules":{"username":{"required":true,"remote":{"url":"http:\/\/localhost\/mytest\/public_html\/welcome\/remote","type":"post"}},"onkeyup":false});});

该功能现在正在运行，一切都很好。

问题：有没有办法让我的 .js 文件中包含我的验证 javascript 函数（因此可以对其进行压缩等） - 并且仍然为每个页面动态加载验证的“规则”部分？

如果需要，我可以更改 $jquery_validation 的“输出”和语法 - 但关键是我需要能够动态输出每个页面的规则

4

5 回答 5

2

或者你可以这样做：

var _pageValidationRules = <?php echo $jquery_validation; ?>

// Code below can be compressed
$(function() {
    $('#signupform').validate({
        wrapper: 'span class="error"',
        meta: 'validate',
        highlight: function(element, errorClass, validClass) {
            // ...
        },
        unhighlight: function(element, errorClass, validClass) {
            // ...
        }
        rules: _pageValidationRules
    });
});​
于 2012-04-17T05:45:20.290 回答
1

您可以将javascript代码放在任何.js文件中并对其进行压缩，然后它可以对HTML页面中的数据进行操作。两者不必在同一个文件中。如果您的代码在加载时执行，您只需要确保它在页面中定义代码之后首先运行，方法是在代码进入页面之后物理定位它，或者在执行之前等待页面加载代码。

于 2012-04-17T05:39:21.287 回答
1

是的，您可以创建一个对象并将其保存到变量中并保存构造函数中的详细信息（不记得它在 JS 中的名称）。

这是我在我的一个脚本中使用的示例。

var rmlsSearch = function(searchEndpoint) {

  this.fname = '';
  this.lname = '';
  this.searchEndpoint = searchEndpoint;
  this.resultTemplate = $('#rmls-search-result-template').html();

  //Preform inital search
  this.searchAgent();

  //Bind search function to search button
  $('#rmls-search-button').one('click', $.proxy(this.searchAgent, this));

};

有了这个定义，你就可以在任何你想要的地方实例化它，并传入你需要的任何细节。

var rmlsHandle = rmlsSearch("some endpoint I'm planning on using");

搜索代理函数，原型化为对象：

rmlsSearch.prototype.searchAgent = function(){

  //Get the agent details from the form on the page
  this.getAgentDetails();

  //... Whatever else you'd need to do in the function
};
于 2012-04-17T05:40:16.443 回答
1

PHP 需要被浏览器渲染才能执行动态内容。因此，尝试将 PHP 放入外部 js 文件将不会被读取。

于 2012-04-17T05:42:43.463 回答
1
  • 创建一个 PHP 脚本，它将以 JSON 格式返回验证规则。
  • 使用脚本标签加载该脚本，它可以是 PHP 文件（以提高性能设置正确的 HTTP 缓存设置，因此它将保留在浏览器缓存中）
  • 从外部 JS 静态文件加载验证逻辑
于 2012-04-17T05:58:50.547 回答