最近写的一个项目中,页面中有很多的“text文本框”和“select下拉框”
校验input框和select框是否非空,如果为空给出提示。反之,隐藏提示内容。
html 页面中的input类型有type="text" type="button" +后台需要的传id的 type="hidden"
js代码如下:
function validateForm() { var result = true; var count = 0; //input验证 这里验证type!='hidden' 的原因是 后台需要将id传到该页面中,有id才能将数据库中的数据加载到页面中。 var $input = $("input[type!='button'][type!='hidden']");//这里遍历input不为button和hidden的以外的其他input内容 $.each($input, function (i, item) { var val = $(item).val(); if (val == "" || val == null || val == undefined) { $(item).siblings(".hint").css("visibility", "visible"); count++; } else { $(item).siblings(".hint").css("visibility", "hidden"); } }); //select验证 var $select = $("select"); $.each($select, function (i, item) { var val = $(item).children("option:selected").val(); if (val == "" || val == null || val == undefined) { $(item).siblings(".hint").css("visibility", "visible"); count++; } else { $(item).siblings(".hint").css("visibility", "hidden"); } }); //textarea验证 var $textarea = $("textarea"); $.each($textarea, function (i, item) { var val = $(item).val(); if (val == "") { $(item).siblings(".hint").css("visibility", "visible"); count++; } else { $(item).siblings(".hint").css("visibility", "hidden"); } }); if (count > 0) result = false; return result; } /*提交表单验证结束*/