semantic-ui - Semantic-ui 表单验证基本设置

问题描述

我是语义 ui 和 javascript 的新手，所以请多多包涵。我有一个基本表单，我正在尝试使用内置的表单验证语义 UI 提供。此表单是使用 node、express 和 pug 的 Web 应用程序的一部分。我正在处理的特定表单（视图）的结构如下所示：

很抱歉使用图片，但我正在努力保持这种高水平。如您所见，我有一个表单（我相信必要的类）、一个提交按钮和一个最后的脚本块，这是我目前获得验证代码的地方。

这是我的验证代码，例如：

     $('#new-password-form').form({
        on: 'blur',
        fields: {
          password: {
            identifier : 'password',
            rules: [
              {
                type  : 'empty',
                prompt: 'You must enter a password'
              },
              {
                type  : 'regExp[/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\$%\^&\*])(?=.{8,})/]',
                prompt: 'Your password must be at least 8 characters long, and contain upper and lower case characters, digit(s), and symbol(s)'
              }
            ]
          }
        }
      }, {
          onSuccess : function(e){
            e.preventDefault();
          }
      });

问题是，验证不起作用。当我单击提交按钮时，表单会尝试定期获取提交，就好像 javascript 不存在一样。然而它就在那里。节点显示浏览器正确获取和加载所有内容。检查呈现的 HTML 显示一切都在那里，我在控制台中看不到任何错误。该页面似乎已成功加载所有必需文件，如下所示：

GET /enroll/new 200 31.281 ms - 2652
GET /stylesheets/style.css 200 0.859 ms - 735
GET /jquery/jquery.js 200 1.491 ms - 280364
GET /ui/semantic.min.css 200 1.508 ms - 628536
GET /ui/semantic.min.js 200 2.070 ms - 275709
GET /images/amm.png 200 2.068 ms - 25415
GET /ui/semantic.min.css 200 0.418 ms - 628536
GET /favicon.ico 404 9.768 ms - 1499

那么给了什么？有人可以告诉我我做错了什么吗？如果我在这里的内容还不够，很高兴提供更多细节。

更新：

我将 HTML 提取到一个平面文件，并重新链接资产（png、js、css），因此根本不涉及服务器。页面在浏览器中加载就好了。我得到了完全相同的行为（单击提交时什么都没有发生，除了页面使用获取参数重新加载——默认的非 js 行为 AFAIK）。这让我觉得 jQuery 或 javascript 本身有问题。

标签： semantic-ui

好吧，我发现了问题......“类型：”行（regExp [/^（？=。* [az]）......）的末尾缺少'，'。

现在验证对静态文件和服务器版本都有效。对于从其他语言获得的价值，这不是问题，javascript 普遍使用内联函数和嵌套多层深度的数据结构是我很难习惯的事情。很容易错过一些关键的小片段。

我想这是另一个语义用户界面基本设置的例子……只要你不遗漏任何逗号。（我为那些可能想要复制/粘贴的人修复了上面的代码）

semantic-ui - Semantic-ui 表单验证基本设置

问题描述

解决方案

推荐阅读