html表单属性和验证

-1

我试图通过查看一堆不同的例子来找出基本的HTML表单验证。html表单属性和验证

我在由Kajabi用一个例子来，有一个在http://megaph.com/pages/39841

当，当我看着表单标签包含这个相当奇怪的标签QL-选择启用一个例子。如果我删除这个标签，表单验证将停止工作，但表单会重定向到aweber。如果我放置它，验证工作，但形式不会发布。

它没有通常的属性，它可能不是CSS

我只是好奇这是什么，以及为什么它的工作原理。任何人有任何想法？

来源

2014-09-29 SimbaFX

正如ceejayoz指出的那样，他们的验证是自定义的，并且很难解构。如果您试图了解表单验证，那么这不是最好的研究范例。

如果你只是想自己实现表单验证，下面是一个替代的“构建你自己的”表单验证 - 非常简单。

它将字段标签和ID存储在一个数组中，然后遍历数组来测试每个字段。完成后，它会报告哪些字段验证失败。

jsFiddle Demo

HTML：

One: <input type="text" id="f1"><br /> 
Two: <input type="text" id="f2"><br /> 
Three: <input type="text" id="f3"><br /> 
Four: <input type="text" id="f4"><br /> 
<br /> 
<input type="button" id="mybutt" value="Go" />

jQuery的：

var chkFld, arrAll = {'One':'f1','Two':'f2','Three':'f3','Four':'f4'}; 

$('#mybutt').click(function() { 
    var errMsg='', badFlds='', firstBad=''; 
    for(var key in arrAll){ 
     chkFld = '#'+arrAll[key]; 
     $(chkFld).removeClass('error'); 
     if ($(chkFld).val() ==''){ 
      $(chkFld).addClass('error'); 
      //alert('Please complete field ' + arrAll[key]); 
      errMsg += '*' + key + '\n'; 
      if (firstBad=='') firstBad=chkFld; 
     } 
    } 
    if (errMsg != '') { 
     alert(errMsg); 
     $(firstBad).focus(); 
    } 
}); //END mybutt.click

CSS：

.error{border:1px solid red;background:yellow;}

来源

2014-09-29 16:24:26 gibberish

这不是什么标准。他们只是添加任意属性并使用JavaScript来处理它们。看看他们的JS显示线如this.emailInput=this.formEl.find('[ql-id="optin_email"] input')。

来源

2014-09-29 16:15:09 ceejayoz

这真的很有帮助，我没有意识到自定义属性，直到我阅读你的文章，所以这就让问题更加清晰。我通常只是使用jquery插件进行验证，而我之前没有看到过这种方法，只是好奇而已。再次感谢 – SimbaFX 2014-09-30 16:20:25

@SimbaFX关于这些任意属性的注释--HTML5引入了'data'属性作为这样做的标准方法。 – ceejayoz 2014-09-30 16:25:24

html表单属性和验证

回答

相关问题