Question

我是语义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();
          }
      });

麻烦是，验证无法正常进行。当我单击“提交”按钮时，表单会尝试进行常规的get提交，就好像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），因此根本不涉及任何服务器。页面在浏览器中的加载很好。我得到了完全相同的行为（单击提交时没有任何反应，除了使用get参数重新加载页面-默认的非js行为AFAIK）。这让我觉得jQuery或javascript本身有问题。

Answer 1

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

现在，验证适用于静态文件和服务器版本。对于没有问题的其他语言来说，这是值得的，但是javascript广泛使用内联函数和嵌套在多个级别的数据结构是我很难适应的事情。太容易错过一些关键的小片段。

我想让这成为语义ui基本设置的另一个示例，只要您不留任何逗号，它就可以起作用。（我为可能要复制/粘贴的代码修复了上面的代码）

语义UI表单验证基本设置

1 个答案: