如何对未知表单元素进行表单验证?

时间:2015-03-25 03:48:09

标签: javascript jquery-validate

现在我正在开展一项任务,我需要在客户端使用java脚本对JQuery验证器进行表单验证。主要的想法是我们不要硬编码字段名称,例如我需要的名称年龄国家以更一般的方式验证表单。我们使用Javascript框架handlebar.js创建一个输入的网页,这个数据是从注册表派生的rxt注册表扩展文件。我是一个非常新的车把框架,我已经尝试过简单的示例handlebar.But它不适合我。我已经在下面分享了我的html和js代码。请任何人都可以提出一些建议来纠正这个错误。谢谢你提前?

<!DOCTYPE HTML>   
<html>
    <head>
        <title>Handlebars.js Example Template</title>
        <script type="text/javascript" src="js/handlebars.js"></script>
    </head>
    <body>
		<div id="menu-placeholder"></div>
		<script id="menu-template" type="text/x-handlebars-template">
		    <ul>
			<li><a href="{{linkURL1}}">{{linkName1}}</a></li>
			<li><a href="{{linkURL2}}">{{linkName2}}</a></li>
			<li><a href="{{linkURL3}}">{{linkName3}}</a></li>
			<li><a href="{{linkURL4}}">{{linkName4}}</a></li>
			<li><a href="{{linkURL5}}">{{linkName5}}</a></li>
		    </ul>
		</script>
		<script type="text/javascript" src="js/script.js" /></script>
	
    </body>
</html>

和我的javascript代码

var menuData = {
    linkName1 : "Link 1",
    linkName2 : "Link 2",
    linkName3 : "Link 3",
    linkName4 : "Link 4",
    linkName5 : "Link 5",
    linkURL1 : "http://google.com",
    linkURL2 : "http://jaskokoyn.com",
    linkURL3 : "http://yahoo.com",
    linkURL4 : "http://youtube.com",
    linkURL5 : "http://twitter.com"
};


// Grab the HTML source that needs to be compiled
var menuSource = document.getElementById( 'menu-template' ).innerHTML;
// Compiles the source
var menuTemplate = Handlebars.compile( menuSource );



// Process Template with Data
document.getElementById( 'menu-placeholder' ).innerHTML = menuTemplate( menuData );

1 个答案:

答案 0 :(得分:0)

对字段名称使用必需属性,例如

<input id="cemail" type="email" name="email" required>

并在javascript中只写:

$("#yourform").validate();

这样它就可以将输入验证为电子邮件。你不需要硬编码javascript中的字段名称,规则,但是在html元素中

方法2: 如果要将所需规则添加到具有类名req的所有输入

<input id="fname" type="text" name="fname" class="req">

$("input.req").each (function (){
    $(this).rules( "add", {
      required: true,
    });
});