我似乎无法弄清楚这里的问题是什么。我已经尝试将我的js放在我的脑海里,在我的表格之下,在我的表格之上,等等。他们似乎都没有做任何事情。它只是在没有尝试验证
的情况下提交页面HTML:
<div class="content">
<h1>Submit A Lost Paw</h1>
<p>Please complete the form below. After being reviewed by a moderator, your listing will be posted for others to see.</p>
<ul id="error-box">
</ul>
<form id="test" name="test" action="test.php" method="post">
<div class="section">
<div class="input-title">
<label for="pet_name">Pet Name:</label>
</div>
<div class="input">
<input id="pet_name" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="date_missing">Date Pet Went Missing:</label>
</div>
<div class="input">
<input id="date_missing" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="location">Location:</label>
</div>
<div class="input">
<input id="location" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="age">Age:</label>
</div>
<div class="input">
<input id="age" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="colors">Colors:</label>
</div>
<div class="input">
<input id="colors" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="contact_name">Contact Name:</label>
</div>
<div class="input">
<input id="contact_name" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="phone">Phone:</label>
</div>
<div class="input">
<input id="phone" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="email">Email:</label>
</div>
<div class="input">
<input id="email" type="text" />
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
<label for="add_details">Additional Details:</label>
</div>
<div class="input">
<textarea id="add_details"></textarea>
</div>
<div class="clear"></div>
</div>
<div class="section">
<div class="input-title">
</div>
<div class="input">
<input type="submit" value="Submit for Review" />
</div>
<div class="clear"></div>
</div>
</form>
</div>
使用Javascript:
<script type="text/javascript">
$(document).ready(function() {
$("#test").validate({
errorLabelContainer: "#error-box",
wrapper: "li id='error'",
rules: {
pet_name: {
required: true
}
}
});
});
</script>
截至目前,js位于html的正下方,位于同一个文件中。整个文件被拉入一个索引页面,其中包含了在头部拉入的validate.js文件。
答案 0 :(得分:8)
您需要输入字段的名称属性,例如
<input id="pet_name" name="pet_name" type="text" />
答案 1 :(得分:1)
您似乎没有在元素中添加任何类或在插件上执行任何其他javascript方法调用以指定验证行为。
通常,您会添加required
,email
,url
等类来确定验证行为(或者调用插件方法来执行相同操作。
答案 2 :(得分:-1)
我还没看到你的头,请确保包含以下内容
$(function(){
$("#test").validate();
})
jQuery.validator.setDefaults({
debug: true,
success: "valid",
submitHandler: function(form) { posting(); }
});
您可能不需要提交处理程序,“发布”部分是您将ajax脚本转换为函数并使用处理程序调用它的位置。当然,你需要围绕
的脚本标签