您的位置:首页 > Web前端 > JQuery

jQuery.validator自定义验证

2016-05-25 10:11 579 查看
需求:在新增信息前端验证必须上传图片,在修改时不用。

思路:无论在新增还是在修改,图片都会有<img>标签进行预览,只是新增的时候img.src不会有值。所以我们通过这个值来判断是新增还是修改。

// 在修改信息时,图片不用必填
// 要求在input上写data-img-according-to="图片预览的id"
$.validator.addMethod("imgAccordingTo", function (value, ele, params) { // value:期望值 ele:被选元素, params:求留言告知
var accordingObjData = $("#" + $(ele).data("img-according-to")).attr("src"); // 获得data-img-according-to属性的值,该值指向判断img.src值的dom
if(accordingObjData) {
return true;
} else {
return $(ele).val(); // 虽然返回的是value,但是根据js的判断规则,非null,非空字符串,非undefined都是true
}
}, "必填");


<img id="img-file-display" style="width: 150px;height: 150px;" src="${filePrefix}${entity.img}" alt="上传广告图片"/>
<input type="file" class="form-control" name="imgFile" id="imgFile" placeholder="上传广告图片" data-img-according-to="img-file-display"/>


rules: {
imgFile : {
imgAccordingTo : true
}
},
messages: {
imgFile : {
imgAccordingTo : "必填"
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: