字段不能为NULL
Field cannot be NULL
如何编写一个严格必须有值的代码,否则"立即付款"按钮将无法继续。
例如字段
- 卡类型一值必须为选定值
- 和输入卡号必须有一个值
- 和Enter Pin也必须具有值
否则"立即付款"按钮将显示"请确保所有详细信息都已填写。
HTML
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Terms & Conditions</title>
<link rel="stylesheet" type="text/css" href="css/format.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/jquery.mobile-1.4.2.min.css">
<script src="js/jquery-1.10.2.min.js"></script>
<script src ="js/jquery-1.11.0.min.js"></script>
<script src="js/jquery.cycle.all.js"></script>
<style type="text/css">
</style>
</head>
<body background="images/wallpaper.jpg">
<h22><h1>
<h> Purchase </h>
</h1></h22>
<p> </p>
<p> </p>
<hr></hr>
<p> </p>
<h22><h1><p1><fieldset>
<form action = "">
<p>
<span>
PAYMENT GATEWAY
</span>
<br /><br />
<form>
Card Type:
<select>
<option value="" style="display:none">Select</option>
<option value="one">Master Card</option>
<option value="two">VISA Card</option>
</select>
<p> </p>
Enter Card No:<input type="text" name="cardno" placeholder="0000-0000-0000"><br>
<p> </p>
Enter Pin No:<input type="text" name="pinno" placeholder="000">
<p><sil>(Your 3-Digit pin can be found at the back of your card)</sil></p>
<p> </p>
<input type="submit" value="PAY NOW" onclick="alert('THANK YOU,Your Order Will Be
Processed Shortly.Stay TUNE..');">
</form>
<br /> <br /></p>
</form>
</fieldset></p1></h1></h22>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>
您可以检查函数中所有字段的值,该函数将在单击表单的提交按钮时调用
function validate()
{
var cardType = $("#cardType");
var cardNo = $("#cardno");
var pinNo = $("#pinno");
if(cardType[0].selectedIndex == 0 ){
alert('Please select card type');
return false;
}
if(cardNo.val() == '')
{
alert('Please enter card number');
return false;
}
if(pinNo.val() == '')
{
alert('Please enter pin number');
return false;
}
alert('THANK YOU,Your Order Will Be Processed Shortly.Stay TUNE..');
return true;
}
我已经为所有字段提供了id。根据您的要求更换选择器
这可能有助于验证表单字段。
您可以使用jquery验证插件进行验证。
这是链接,只需转到该链接并浏览文档即可。
http://jqueryvalidation.org
你的代码可能像这个
<script>
$(document).ready(function () {
$("#payment").validate({
rules:
{
name:{
required:true,
},
cardno:{
required:true,
minlength:16,
},
year: {
required: true,
},
month: {
required: true,
},
cvv:{
required:true,
minlength:3,
},
},
messages:
{
name:
{ required:"Card Holder's Name is Required"
},
cardno:
{ required:"Card Number is Required",
minlength:"Enter Valid Card Number"
},
year:
{ required:"Year is Required"
},
month:
{ required:"Month is Required"
},
cvv:
{ required:"CVV Number is Required",
minlength:"Enter Valid CVV Number"
},
}
});
</script>
相关文章:
- 未捕获的类型错误:不能设置属性'src'当想要切换图像时为null
- 未捕获类型错误:不能读取属性'translatedText'null "
- 不能读取属性'使用querySelector返回null
- HTML5 WebApp -不能从null"使用jQuery ajax
- 如何解决TypeError:不能在函数中将未定义或null转换为对象.键(& lt; anonymous>)
- 标签中的标签- JavaScript错误-不能设置属性className为null
- Slick .js不能添加null错误
- 不能设置property 'value'输入为null
- 未捕获的类型错误:不能设置属性'onclick'null的onclick不起作用
- Javascript不能访问document: null或undefined
- 未捕获的类型错误:不能设置属性'innerHTML'在phonegap中为null
- 不能调用'appendChild'对于iframes为null
- 当使用hasOwnProperty时,不能将null或undefined转换为对象
- 为什么我不能通过调用setMap(null)来删除方向?
- 不能设置property 'value'javascript中的null
- 不能读取属性'style'动态HTML代码中的null
- 未捕获的类型错误:不能读取属性'null - error在Chrome
- 不能设置属性'src'JavaScript中的null
- 不能读取属性'insertBefore'null - handsontable.full.js:3714
- 为什么当number的值在AngularJs中非法输入时,绑定到null不能工作?