input 框提示信息
给input添加提示信息,只需添加 “placeholder”的class,将提示信息放在value中,
其中“placeholder”的名字是随便取的,不是H5的“placeholder”属性
例子:
<input class="placeholder" id="" value="我是提示信息"/>
初始化时执行下面方法:
$(".placeholder").each(function () {
var tip = $(this).val() + ' ';
//默认值为提示信息
$(this).val(tip).attr('style', 'color:#6ec1e0;text-align:right;');
$(this).focus(function () {
if ($(this).val() == tip) {
$(this).val("").attr('style', 'color:#808080;text-align:left;');
}
}).blur(function () {
if ($(this).val() == "") {
$(this).val(tip).attr('style', 'color:#6ec1e0;text-align:right;')
}
});
});
input 框提示信息的更多相关文章
- CSS渐变字体、镂空字体、input框提示信息颜色、给图片加上内阴影、3/4圆
1.渐变字体 主要是看:-webkit-background-clip: text; 该属性 <style> .b1{ width: 500px; height: 200px; font- ...
- 吐血bug-- 多个input框接连blur事件导致alert接连弹出
本来今天想记录一下Flow在vue源码中的应用,结果临时触发了个bug... bug描述: elementUi + Vue 技术 需求:一个表格中有至少两条数据,每条数据都有input框,在失去焦点后 ...
- 前端获取文件input框的美化操作
前面我们说了一种利用input框和js的当时获取本地文件内容的情况-详细信息参考 2017年11月8日前端用js获取本地文件的内容 以上方式获取的按钮是系统默认的显示,有时候我们需要对按钮的外观进行美 ...
- el-mement表单校验-校验失败时自动聚焦到失败的input框
思路:调用input的focus()事件,聚焦到失败的input框上, 问题:如何获取失败的input框,结合element的校验方法,查看可以提供入口的地方 调用this.$refs[formNam ...
- input框focus时的美化效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- javascript onblur事件阻塞选中input框
先上问题实例: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <t ...
- 如何让input框自动获得焦点
项目中有个需求 一个用扫描枪输入的input框 为了避免每次都需要人为点击 需要做成当打开页面时该input框自动获取焦点 <input type="text" name= ...
- 类似input框内最右边添加图标,有清空功能
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- php页面输出时,js设置input框的选中值
/* 设置表单的值 */ function setValue(name, value) { var first = name.substr(0, 1), input, i = 0, val; if ( ...
随机推荐
- js客户端UI框架
Best jQuery UI http://b-jui.com/ jQuery EasyUI http://www.jeasyui.com/ bootstrap学习网: http://www.runo ...
- 解决ubantu中sublime不支持中文的方法
更新然后将系统升级到最新版本,在linux终端输入 sudo apt-get update && sudo apt-get 在本地目录中克隆此repo: 如果你没有git的话就安 ...
- FastAdmin 后台 UserRule 勾选不完整 Bug 修复
FastAdmin 后台 UserRule 勾选不完整 Bug 修复 当用户权限的级选择时出现有部分没有选中. 修复来自在 qmit 1 public static function getTreeL ...
- Linux IO 监控与深入分析
https://jaminzhang.github.io/os/Linux-IO-Monitoring-and-Deep-Analysis/ Linux IO 监控与深入分析 引言 接昨天电话面试,面 ...
- 数据流重定向和管道命令, grep, tr,sort, wc, cut,split,tee,sleep(shell 02)
主要内容 1.标准输入输出和错误 2.管道命令和 grep, tr,sort, wc, cut,split,tee,sleep 标准输入输出和错误 标准输入(stdin) 是指令数据的输入,代码为0, ...
- Git使用点滴记录: You have no permission to access this repo.
代码托管在https://coding.net上面,之前Git用https的方式都好好的,没有出什么问题.结果今天git pull代码的时候一直提示以下信息: remote: Coding.net T ...
- Thinkphp或查询使用
if ($_GET['machine_type_id']) { $machine_type_id = trim($_GET['machine_type_id']); $where['machine_t ...
- Venom的简单使用
工具地址:https://github.com/r00t-3xp10it/venom 打开到venom目录,输入./venom.sh 打开程序 按回车键继续 这里有很多的模块,要用哪个模块就输入它的编 ...
- 转:Python正则表达式指南
本文介绍了Python对于正则表达式的支持,包括正则表达式基础以及Python正则表达式标准库的完整介绍及使用示例.本文的内容不包括如何编写高效的正则表达式.如何优化正则表达式,这些主题请查看其他教程 ...
- Unable to correct problems, you have held broken package
其实这篇接着上文(一),主要是解决samba安装的问题,中间又是一路曲折.不过这个问题也算是比较典型,有必要记录一下. #apt-get install smb* 安装失败.其实顺利的话,直接一条这样 ...