巧用weui.topTips验证数据的实例

巧用weui.topTips验证数据的实例

场景一、有一个输入金额的场景，这个金额需要验证，验证说明如下：

不能为空格；

不能为0；

不能为汉字；

不能为其它字符；

不能大于200；

唯一可以的是，只有输入3~199之间的数字，下面的确定按钮才会显示，否则，隐藏这个按钮。

HTML：

其它

JS：

场景二、所有违反规距的都有信息提示，但是“确定”按钮不隐藏，只是删除它的click事件，只有符合条件的才可以跳转

//验证

$('input').on('blur', function() {

var value = this.value;

var regChinese = new RegExp("[\\u4E00-\\u9FFF]+", "g"); //汉语

var specialSymbol =/[`~!@#$%^&*_+<>{}\/'[\]]/im; //特殊符号

//字符串不能为空

if(value.length == 0) {

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('不能为空，请重新输入');

}, 500);

//字符串是否为“空”字符即用户输入了空格

} else if(value.replace(/(^s*)|(s*$)/g, "").length == 0) {

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('不能为空，请重新输入');

}, 500);

//字符串是否为空或者全部都是空格

} else if(value == null) {

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('不能为空，请重新输入');

}, 500);

//字符串是否为汉字

} else if(regChinese.test(value)) {

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('不能输入汉字，请重新输入');

}, 500);

//字符串不能为0

} else if(parseInt(value) == 0) {

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('不能为0，请重新输入');

}, 500);

//小于3

} else if(parseInt(value) < 4) {

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('自定义金额不能小于3，请重新输入');

}, 500);

//不能大于200

} else if(parseInt(value) > 200) {

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('自定义金额不能大于200，请重新输入');

}, 500);

} else if(specialSymbol.test(value)){

//禁止输入特殊字符

$('#otherPriceBtn').unbind('click');

setTimeout(function() {

$('.hide-description').css('display', 'block').text('不可输入！@#￥%……&*特殊http://字符！');

}, 500);

//自定义金额只能是数字

} else if(typeof(parseInt(value))) {

setTimeout(function() {

$('.hide-description').css('display', 'block').text('你设置的金额为' + value);

}, 500);

//其它金额

$('#otherPriceBtn').on('click', function(e) {

var otherPrice = $('#dialogPrice').val();

otherPrice = parseInt(otherPrice);

otherPrice = otherPrice.toString();

console.log("其它金额" + otherPrice);

var data = {

userId: userId,

price: otherPrice

};

data = JSON.stringify(data);

$.ajax({

data: {},

dataType: 'json',

type: "post",

url: postDoctorPrice().replace("{userId}", userId).replace("{price}", otherPrice), //post 时url带参数

contentType: 'application/json; charset=utf-8',

success: function(data) {

ifaxRMUxKir(data && data.status == '200') {

weui.topTips('设置成功！');

}

},

error: function(data) {

location.href = 'doctor_wode.html';

}

});

});

}

})

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。