判断form表单每个input字段是否有内容

//input失去焦点时判断是否有值 若没有 则不能点击保存
                function Input_verification() {//input的内容
                    var input_val = null;
                    //是否能够点击保存
                    var canClick = false;
                    this.init = function (fo, btn) {
                        //input列表
                        fo.input = [];
                        //表单下的input
                        var input_text = fo.find(‘input[type="text"]‘);
                        var input_number = fo.find(‘input[type="number"]‘);
                        var input_password = fo.find(‘input[type="password"]‘);
                        var input_email = fo.find(‘input[type="email"]‘);
                        var input_search = fo.find(‘input[type="search"]‘);
                        var input_tel = fo.find(‘input[type="tel"]‘);
                        var input_url = fo.find(‘input[type="url"]‘);
                        var input_date = fo.find(‘input[type="date"]‘);
                        var input_datetime = fo.find(‘input[type="datetime"]‘);
                        var input_datetime_local = fo.find(‘input[type="datetime-local"]‘);
                        var input_month = fo.find(‘input[type="month"]‘);
                        var input_week = fo.find(‘input[type="week"]‘);
                        var input_time = fo.find(‘input[type="time"]‘);
                        var input_textarea = fo.find(‘textarea‘);
                        inp_arr(fo, input_text);
                        inp_arr(fo, input_textarea);
                        inp_arr(fo, input_number);
                        inp_arr(fo, input_password);
                        inp_arr(fo, input_email);
                        inp_arr(fo, input_search);
                        inp_arr(fo, input_tel);
                        inp_arr(fo, input_url);
                        inp_arr(fo, input_date);
                        inp_arr(fo, input_datetime);
                        inp_arr(fo, input_datetime_local);
                        inp_arr(fo, input_month);
                        inp_arr(fo, input_week);
                        inp_arr(fo, input_time);
                        inp_blur(fo.input);
                        btn_click(btn, fo.input);
                    };
                    //把每个input放入数组
                    var inp_arr = function (fo, input_a) {
                        for (var o = 0; o < input_a.length; o++) {
                            fo.input.push(input_a[o]);
                        }
                    };
                    //给每个元素绑定失去焦点事件
                    var inp_blur = function (inp) {
                        for (var i = 0; i < inp.length; i++) {
                            $(inp[i]).blur(function () {
                                input_val = $(this).val();
                                //值为空提示信息
                                if (input_val == ‘‘) {
                                    $(this).attr(‘placeholder‘, ‘内容不能为空‘).prev(‘i‘).css(‘color‘, ‘red‘);
                                } else {
                                    $(this).prev(‘i‘).css(‘color‘, ‘#e6e6e6‘)
                                }
                            })
                        }
                    };
                    //给每个提交按钮绑定点击事件
                    var btn_click = function (btn, inp) {
                        btn.click(function () {
                            //循环整个表单是否有input值为空
                            for (var k = 0; k < inp.length; k++) {
                                if (inp[k].value == ‘‘) {
                                    canClick = false;
                                    break;
                                } else {
                                    canClick = true;
                                }
                            }
                            //若值都不为空,开放保存按钮点击权限
                            if (canClick) {
                                btn.parent().removeClass(‘form_btn_1‘).children(‘button‘).addClass(‘btn_top‘).siblings(‘div‘).css(‘display‘, ‘block‘);
                            } else {
                                console.log(‘can not‘)
                            }
                        })
                    };
                }

                var form_input = new Input_verification();
                var form1 = $(‘#form1‘);
                var btn1 = form1.children(‘.form_btn‘).children(‘button‘);
form_input.init(form1, btn1);
时间: 2024-10-25 16:26:48

判断form表单每个input字段是否有内容的相关文章

ajax form表单提交 input file中的文件

ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了解决这个问题我走了不少弯路: 1.用原生的 input file , 不支持ajax上传文件,你肯定会说可以用 ajax form表单上传了呀?不过我后面还要调用上传成功后用js处理一些对话框,所以这种方法排除 2.用了 uploadify 上传插件,弄出来能上传东西,结果不理想:因为不能判断上传的

ExtJs如何判断form表单是否被修改过详解

1.Extjs表单提交主要有三种方式: 1, EXT的form表单ajax提交(默认提交方式)      相对单独的ajax提交来说优点在于能省略写参数数组 ,form.getForm().submit 3.EXT的ajax提交,Ext.Ajax.request 2.EXT表单的非ajax提交 在我看来:采用第1,2种都很方便,关键是Ext.Ajax.request传递给后台是一个字符串形式的,需要Jason解析 2.记录代码问题: 1 SaveStudentDetails:function(b

JQuery判断form表单是否为空

功能:通过jquery判断form表单中是否有内容还未填写,如果有未填写的,则阻止提交 $(function () { $('form').bind('submit',function () {  //给form标签绑定submit事件 var i=0; $("input").each(function(){  //遍历input标签,判断是否有内容未填写 var vl=$(this).val(); if(vl==""){ i=1; } }); var t=$('t

jQuery判断 form表单提交时如果表单里有input标签为空那么不提交form表单

<head> <script type="text/javascript"> $("#sub1").click(function(){ var text1=$("#text1").val(); if(text1==""){ alert("不能为空!"); $("#text1").select(); $("#text1").focus(); }e

常用6种type的form表单的input标签分析及示例

<input> 标签用于搜集用户信息. 根据不同的 type 属性值,输入字段拥有很多种形式.输入字段可以是文本字段.复选框.掩码后的文本控件.单选按钮.按钮等等. 在这里博主介绍6中type的input,分别是文本域.密码字段.单选按钮.复选按钮.提交按钮以及指定图片按钮 1:文本域 文本域通过< ... 653rai悼抑戳眯陨桨<http://baobao.baidu.com/question/ba4ad4dffdea7da838c2d08783ca1801.html?=D&g

input file 在开发中遇到的问题 类似ajax form表单提交 input file中的

http://www.midifan.com/moduleuser-index-428015.htmhttp://www.midifan.com/moduleuser-index-428074.htmhttp://www.midifan.com/moduleuser-index-428060.htmhttp://www.midifan.com/moduleuser-index-428282.htmhttp://www.midifan.com/moduleuser-index-428172.htm

java获取form表单里的字段和文件流

Map map=new HashMap(); boolean isMultipart = ServletFileUpload.isMultipartContent(request); if (isMultipart) { // 文件上传 // 用stream api处理,提高性能 // System.err.println("file upload request..."); ServletFileUpload upload = new ServletFileUpload(); Fil

django form表单动态加载下拉列表选项内容

三张表:应用名称表"appname",单位表"unit",应用名称表和单位表多对多关系表"unit_unit_permissionList" model_appname.py # -*- coding: utf-8 -*- from django.contrib import admin from django.db import models from django.utils.translation import ugettext_lazy

form表单input file类型的重置

我们知道form表单的dom中有一个reset方法,通过 document.getelemetbyid('yourform').reset()可以重置表单. Jquery对象没有reset方法,所以jquery的重置也是通过dom的reset方法完成,即 $('yourform')[0].reset() 对于form表单的input file类型的元素,在其他主流浏览器中通过form的reset方法完全可以重置 但是IE9以及以下对input file类型,reset无法重置.查了一些资料据说是