//---------------------------------------------------input失去焦点时判断是否有值
btn_click: function () {
//input失去焦点时判断是否有值 若没有 则不能点击保存
function Input_verification() {
//input的是否有内容
var input_val = null;
//是否能够点击保存
var canClick = false;
this.init = function (fo) {
//当前表单的按钮
var btn = fo.children('.form_btn').children('button');
//btn.attr('disabled',true).css('cursor',' not-allowed');
//input列表
fo.input = [];
//表单下的input
var input = fo.find('input');
var input_textarea = fo.find('textarea');
//把每个input放入数组
for (var i = 0; i < input.length; i++) {
if ((input[i].type == 'text')
|| ( input[i].type == 'number')
|| (input[i].type == 'password')
|| (input[i].type == 'email')
|| (input[i].type == 'search')
|| (input[i].type == 'tel')
|| (input[i].type == 'url')
|| (input[i].type == 'date')
|| (input[i].type == 'datetime')
|| (input[i].type == 'datetime-local')
|| (input[i].type == 'month')
|| (input[i].type == 'week')
|| (input[i].type == 'time')
) {
fo.input.push(input[i]);
}
}
//把每个textarea放入数组
if (input_textarea) {
for (var o = 0; o < input_textarea.length; o++) {
fo.input.push(input_textarea[o]);
}
}
inp_blur(fo.input);
btn_click(fo, btn, fo.input);
};
//给每个元素绑定失去焦点事件
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.placeholder = 1;
//console.log(this.parentNode.children[0]);
$(this).attr('placeholder', '内容不能为空').prev('i').css('color', 'red');
} else {
$(this).prev('i').css('color', '#e6e6e6')
}
})
}
};
//给每个提交按钮绑定点击事件
var btn_click = function (fo, btn, inp) {
var form_fo = fo;
var form_parent = $('.nominations form');
var result = '';
var url = '';
btn.click(function () {
//循环整个表单是否有input值为空
for (var k = 0; k < inp.length; k++) {
if (inp[k].value == '') {
canClick = false;
break;
} else {
canClick = true;
}
}
//若值都不为空,开放保存按钮点击权限
if (canClick) {
//如果是第一个form表单
if (form_fo.hasClass('hasID')) {
result = form_fo.serialize();
//获得ajax地址
url = form_fo.attr('form_url');
//取得用户登录ID
result += ('&user_id=' + form_fo.attr('user_id'));
$.ajax({
type: 'POST',
url: url,
data: result,
success: function (txt) {
if (txt.xinxi == '添加成功') {
//给第一个表单下面的所有表单添加属于该表单的uid
for (var u = 0; u < form_parent.length; u++) {
if (!$(form_parent[u]).hasClass('hasID')) {
$(form_parent[u]).attr('uid', txt.id);
}
}
//开放修改按钮
btn.parent().removeClass('form_btn_1').children('button').addClass('btn_top').siblings('div').css('display', 'block');
} else {
btn.html('添加失败');
}
}
})
//如果不是第一个form表单而且第一个表单已交互成功下发uid给下面的表单
} else if (form_fo.attr('uid')) {
result = form_fo.serialize();
result += ('&uid=' + form_fo.attr('uid'));
//获得ajax地址
url = form_fo.attr('form_url');
$.ajax({
type: 'POST',
url: url,
data: result,
success: function (obj) {
if (obj == '添加成功') {
//开放修改按钮
btn.parent().removeClass('form_btn_1').children('button').addClass('btn_top').siblings('div').css('display', 'block');
} else {
btn.html(obj);
}
}
})
} else if (form_fo.attr('user_id')) {
result = form_fo.serialize();
result += ('&id=' + form_fo.attr('user_id'));
//获得ajax地址
url = form_fo.attr('form_url');
$.ajax({
type: 'POST',
url: url,
data: result,
success: function (obj) {
if (obj == '修改成功') {
//开放修改按钮
btn.html(obj);
} else {
btn.html(obj);
}
}
})
}
} else {
for (var i = 0; i < inp.length; i++) {
if (inp[i].value == '') {
$(inp[i]).attr('placeholder', '内容不能为空').prev('i').css('color', 'red');
}
}
}
})
};
} var form_input = new Input_verification();
var form1 = $('#form1');
form_input.init(form1);

 

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

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

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

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

    1.Extjs表单提交主要有三种方式: 1, EXT的form表单ajax提交(默认提交方式)      相对单独的ajax提交来说优点在于能省略写参数数组 ,form.getForm().submi ...

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

    最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...

  4. jQuery判断 form表单提交时一些文本框的判断

    一: form表单提交时如果表单里有input标签为空那么不提交form表单. <head> <script type="text/javascript"> ...

  5. 前端 HTML form表单标签 input标签 type属性 file 上传文件

     加上上传文件功能 input type='file' - 依赖form表单里一个属性 enctype="multipart/form-data" 加上这个属性表示把你上次文件一点 ...

  6. JQuery判断form表单是否为空

    功能:通过jquery判断form表单中是否有内容还未填写,如果有未填写的,则阻止提交 $(function () { $('form').bind('submit',function () {  / ...

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

    <input> 标签用于搜集用户信息. 根据不同的 type 属性值,输入字段拥有很多种形式.输入字段可以是文本字段.复选框.掩码后的文本控件.单选按钮.按钮等等. 在这里博主介绍6中ty ...

  8. form表单 一个input时 回车自动提交

    问题描述 form表单中,如果当前表单只有一个input输入框时,单击回车会自动提交当前表单. 解决方案 在当前form表单中添加一个隐藏的input, <input style="d ...

  9. 前端 HTML form表单标签 input标签 type属性 radio 单选框

    <input type="radio"> 单选框 适用于 选择性别按钮网页等 <!DOCTYPE html> <html lang="en& ...

随机推荐

  1. spring作用

    在SSH框假中spring充当了管理容器的角色.我们都知道hibernate用来做持久层,因为它将JDBC做了一个良好的封装,程序员在与数据库进行交互时可以不用书写大量的SQL语句.Struts是用来 ...

  2. 成都Uber优步司机奖励政策(3月15日)

    滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...

  3. CF 741 D. Arpa’s letter-marked tree and Mehrdad’s Dokhtar-kosh paths

    D. Arpa’s letter-marked tree and Mehrdad’s Dokhtar-kosh paths http://codeforces.com/problemset/probl ...

  4. 让pip 使用国内镜像源

    让python的pip使用 国内镜像 国内源: 清华:https://pypi.tuna.tsinghua.edu.cn/simple 阿里云:http://mirrors.aliyun.com/py ...

  5. #define NULL ((void *)0)引起的风波

    1. 看下宏定义的结构体 typedef struct { ]; //CMEI/IMEI ]; //server ]; //CMEI/IMEI } Options; 2. 定义的NULL #defin ...

  6. 用Scanner读文本文件内容

    import java.io.File; import java.util.Scanner; class Demo { public static void main(String[] args) t ...

  7. php post

    post form function post($remote_server,$data,$second=60){ $ch = curl_init();if(is_string($data)){ $t ...

  8. 使用CRF做命名实体识别(三)

    摘要 本文主要是对近期做的命名实体识别做一个总结,会给出构造一个特征的大概思路,以及对比所有构造的特征对结构的影响.先给出我最近做出来的特征对比: 目录 整体操作流程 特征的构造思路 用CRF++训练 ...

  9. Oracle DELETE和TRUNCATE 的区别

    语法delete from aa truncate table aa 区别 1.delete from后面可以写条件,truncate不可以. 2.delete from记录是一条条删的,所删除的每行 ...

  10. CentOS 7.2静默安装Oracle11g

      Preface       Today I'm gonna export some test data to another server.The source server is Windows ...