function errorInfo(parm) {
//获取文本框值
var $val = parm.val();
if ($val==""||undefined||null){
//创建dom
var errorHtml = $("<div class=\"fail-info-box\"><i class=\"fail-icon\"></i><span class=\"fail-txt\"> !</span></div>\n");
var self = parm;
//获取提示文本值
var name = self.attr("data-name");
//添加高亮
self.addClass("fontColr");
self.css({"border-color":""});
//显示错误信息
errorHtml.children(".fail-txt").html("您的"+name+"填写错误!");
//插入dom
self.after(errorHtml);
//插入之后并显示
errorHtml.show();
}
}
//提交 下一步
function submitData(obj) {
var $inputLen = $(obj).length;
var $top;
for(var i = 0;i<$inputLen;i++){
//是否非空
if($(".fail-info-input").eq(i).val()==""){
//获取 为空的input top值
$top = $(".fail-info-input").eq(i).offset().top-50;
//提示错误信息
errorInfo($(".fail-info-input").eq(i));
//添加高亮
$(".fail-info-input").eq(i).addClass("fontColr");
//滑到未填项 的位置
$("html,body").animate({scrollTop:$top}, 500);
return false;
}
}
}

页面的错误提示  是动态创建的 插入到html 里,点击下一步的时候,遍历页面所有需要校验的input 并获取所有的 input  top值 left值 用来显示错误提示信息的位置,显示的时候需要调用  errorInfo方法,并把input值为空的传入进去 ,就可以了

input错误提示,点击提交,提示有未填项,屏幕滑到input未填项的位置的更多相关文章

  1. 教程-在F9后提示内存错误,点击了乎略,之后怎么取消乎略?

    问题现象:F9后,调试程序,提示内存错误,点击了“乎略”.之后再也没有出现错误了.可是想改这个BUG时,没法取消乎略了. 问题原因:在DLEPHI的选项中是这么一个地方是可以设置的. 问题处理:打开D ...

  2. ASP.NET弹出提示点击确定之后再跳转页面的方法

    //ASP.NET弹出提示点击确定之后再跳转页面的方法 //弹出了提示并且通过location.href转到了DeskTop.aspx页面 Response.Write("<scrip ...

  3. jenkins用户权限配置错误,导致登录时提示:没有Overall/read权限

    jenkins用户权限配置错误,导致登录时提示:没有Overall/read权限 由于初次接触jenkins,于是在搭建好jenkins以后,想要对用户进行管理,于是乎开始在系统管理->conf ...

  4. git提交提示workspace.xml出现conflicted

    问题:在github上管理项目,多次提交以后提交提示workspace.xml出现conflicted原因:Android项目在根目录的.gitignore文件中没有添加.idea文件夹忽略. 解决办 ...

  5. 百度小程序-form表单点击提交,input框内容不会清空

    百度小程序与微信小程序相似度90%.微信小程序转换为百度小程序,部分还是需要人工修改! 做了一个form留言表单,点击提交之后,input框第一次会清空,但是第二次就不会清空了! 不多说直接上代码! ...

  6. 程序连接Oracle数据库出现未找到提供程序.该程序可能未正确安装错误提示

    好不容易使用plsql可以成功连上数据库了,应用程序连接数据库却出现了问题 其实解决这个问题也简单: 1.  查看oracle安装目录下的BIN目录,E:\app\Administrator\prod ...

  7. 谈谈防止Ajax重复点击提交

    首先说说防止重复点击提交是什么意思. 我们在访问有的网站,输入表单完成以后,单击提交按钮进行提交以后,提交按钮就会变为灰色,用户不能再单击第二次,直到重新加载页面或者跳转.这样,可以一定程度上防止用户 ...

  8. jquery+bootstrap实现tab切换, 每次切换时都请求数据, 点击提交分别向不同的地址提交数据

    今天一个朋友叫帮做一个tab切换, 每一个tab内容区域都是从后台取出的数据, 这些数据要用表格的形式显示处理, 并且表格的内容区域可以修改, 如下所示: 例子查看请演示查看. 截图如图所示: 实现步 ...

  9. Linux出现You have new mail in /var/spool/mail/root提示,关闭邮件提示清理内容的解决方案

    Linux出现You have new mail in /var/spool/mail/root提示,关闭邮件提示的解决方案 有的时候敲一下回车,就出来You have new mail in /va ...

随机推荐

  1. error: Microsoft Visual C++ 14.0 is required. Get it with "Microsoft Visual C++ Build Tools": http://landinghub.visualstudio.com/visual-cpp-build-tools

    解决方案 1. http://www.lfd.uci.edu/~gohlke/pythonlibs/#twisted 下载twisted对应版本的whl文件(我的Twisted‑17.5.0‑cp36 ...

  2. ****** 二 ******、软设笔记【数据结构】-KMP算法、树、二叉树

    五.KMP算法:    *KMP算法是一种改进的字符串匹配算法.    *KMP算法的关键是利用匹配失败后的信息,尽量减少模式串与主串的匹配次数以达到快速匹配的目的.具体实现就是实现一个next()函 ...

  3. mysql信息函数

    mysql> SELECT CONNECTION_ID();  #当前连接的ID+-----------------+| CONNECTION_ID() |+-----------------+ ...

  4. C++ 初始化函数

    初始化函数:OnInitDialog()     在这个位置添加初始化代码

  5. Django 详解 中间件Middleware

    Django中间件 还是涉及到django的请求生命周期.middle ware 请求穿过中间件到达url,再经过中间件返回给用户. 简单实例 django项目根目录新建一个Middle文件夹,再新建 ...

  6. HDU 4612 Warm up 连通图缩点

    题目大意:给出一个连通图,求再一个边后,剩余的最少桥数. 题目思路:首先进行缩点得到重构后的图,求出重构后树的直径(通过两次BFS求出相距最远的两点间的距离),ans=重构图边数-树的直径 //#pr ...

  7. 如何在vue中使用动态使用本地图片路径

    不知道各位小伙伴有没有在开发遇到一个问题,就是在线上的项目使用后台返回本地图片路径,然后加载不上的情况呢? 我的解决方法就是:先在项目的data下定义好这样一个数组用于存放需要加载的路径 [ {nam ...

  8. kali linux 安装 matlab2016Rb

    分享安装包: https://pan.baidu.com/s/1hrBd3Li 密码:u9q3 由于Linux版的分为两个镜像,需要挂载后合并: mount R2016b_glnxa64_dvd1.i ...

  9. 20165231 2017-2018-2 《Java程序设计》第1周学习总结

    本周学习的是一些java简单的基本编译,反编译和解释器.然后学习使用git了上传到git@osc进行代码托管,git是初学的,需要建立库然后远程上传代码,如果建立失败或者因为种种缘故无法上传的可以一个 ...

  10. MFC修改对话框标题

    对话框标题栏内容为静态 直接在对话框属性"常规"的"Caption"中修改. 动态生成对话框标题栏内容 SetWindowText()函数就可以 CString ...