JQuery插件，轻量级表单模型验证，供大家参考，具体内容如下

附上源码和Demo段

var validataForm = (function(model) { model.Key = "[data-required='true']"; model.ElementList = new Array(); model.FunctionDictionary = new Dictionary(); model.ToastrCustom = function (msg) { alert(msg); } model.AddElement = function (name) { model.ElementList.push(name); }; model.AddFunction = function (name, func) { model.FunctionDictionary.add(name, func); }; model.Validata = function (formName) { for (var i = 0; i < model.ElementList.length; i++) { var thisObj = model.ElementList[i]; var str = formName + " " + thisObj + model.Key; var elements = $(str); for (var j = 0; j < elements.length; j++) { var element = elements.eq(j); var value = element.val(); var elementType = element.data().type; var func = model.FunctionDictionary.find(elementType); if (func) { var result = func(value, element); if (result.status) { var errorInfo = result.message; model.ToastrCustom(errorInfo); return; } } } } }; model.ElementList.push("input"); model.ElementList.push("select"); model.FunctionDictionary.add("required", function (value, element) { var name = element.data().name; return { status: (value === ""), message: (value === "" && name + "不能为空") }; }); return model;})(window.validataForm || {});

调用处

<form id="ValidataForm"> <input data-required="true" data-name="名称" data-type="required" value=""> <input data-required="true" data-name="昵称" data-type="hello"> <button id="Send">提交</button></form><script src="~/js/plugs/jquery-3.3.1.js"></script><script src="~/js/Dictionary.js"></script><script src="~/js/ValidataForm.js"></script><script type="text/javascript"> $("#Send").click(function () { validataForm.Validata("#ValidataForm"); });</script>

Dictionary这个对象是抄一个博主的
代码附上，内置链接

function Dictionary() { this.add = add; this.datastore = new Array(); this.find = find; this.remove = remove; this.count = count; this.clear = clear;}function add(key, value) { this.datastore[key] = value;}function find(key) { return this.datastore[key];}function remove(key) { delete this.datastore[key];}function count() { var n = 0; for (var key in Object.keys(this.datastore)) { ++n; } return n;}function clear() { for (var key in this.datastore) { delete this.datastore[key]; }}

萌新初试前端，有写得不好的地方，望各位前辈，多多指教。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。