HTML input文本框设置和移除默认值
这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失。
1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码:
<input id="keyword" name="keyword" size="10" class="inputstyle keywords" value="请输入关键字进行搜索"
onfocus='if(this.value=="请输入关键字进行搜索"){this.value="";}; '
onblur='if(this.value==""){this.value="请输入关键字进行搜索";};'>
其实onfocus属性挺好用的,还可以在通过onfocus属性改变css样式,如下代码:
<input id="keyword" name="keyword" size="10" class="inputstyle keywords" value="请输入关键字进行搜索"
onfocus='if(this.value=="请输入关键字进行搜索"){this.value="";}; this.className="input01"'
onblur='if(this.value==""){this.value="请输入关键字进行搜索";}; this.className="input02"'>
2.也可以使用jquery实现:
$(document).ready(function() {
var vdefault = $('#keyword').val(); $('#keyword').focus(function() {
//获得焦点时,如果值为默认值,则设置为空
if ($(this).val() == vdefault) {
$(this).val("");
}
});
$('#keyword').blur(function() {
//失去焦点时,如果值为空,则设置为默认值
if ($(this).val()== "") {
$(this).val(vdefault); ;
}
});
});
HTML input文本框设置和移除默认值的更多相关文章
- input文本框设置和移除默认值
input文本框设置和移除默认值 这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: ...
- js中input文本框设置和移除默认值
这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失. 1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码: <input id=&quo ...
- 使用placeholder属性设置input文本框的提示信息
input文本框中设置提示信息,可以使用placeholder属性 <!DOCTYPE html> <html> <head> <meta charset=& ...
- ie下使用文本编辑器导致input文本框无法聚焦的问题原因
最近公司的一个项目遇到一个如下问题: 描述:测试发现,每当我们在发布活动的页面发布完活动后,页面跳转到我的活动,然后再次回到发布活动页面,发现所有的input文本框都不能聚焦.然后再去看看其他页面(我 ...
- chrome表单自动填充导致input文本框背景变成偏黄色问题
你曾遇到过吗? 困扰宝宝好久的问题,本以为是什么插件导致的,结果是chrome浏览器自动填充文本时默认的样式,搜嘎. 一.修改自动填充input文本框背景色: 使用以下代码 可以设置自己的想要的默认文 ...
- input文本框的value属性在页面中不随输入的数据而变化
今天,在做试验遇到这么一个需求: 一个input文本框,输入值后将标签传到后台,在后台解析标签,发现value仍然是初值,不是我们改变后的值. 例如: <input name="&qu ...
- 实现表单input文本框不可编辑的三种方法
感谢原文作者:青灯夜游 原文链接:https://www.php.cn/div-tutorial-413133.html 目录 问题 实现方式 1.οnfοcus=this.blur() 2.read ...
- input 文本框和 img 验证码对齐问题
input 文本框和 img 验证码对齐问题 在网页制作中,常将 input 和 img 放在同一行,img标签总是比input高出一个头,非常难看. CCS实现input和img水平对齐的方法 同时 ...
- 我的插件のinput文本框实现宽度自适应
先来最后结果:DEMO 介绍一下如何让一个文本框的宽度能够随着文本框中的内容的宽度增长而增长,也就是能够实现宽度自适应效果. 代码实例如下: <!DOCTYPE html> <htm ...
随机推荐
- 【项目经验】navicat工具 SQLServer数据库迁移MySQL
新近领了一个任务,就是把SQL Server的数据库迁移到My Sql上,经过查资料,圆满完成任务.分享一下流程. 1.首先,在自己的My Sql数据库上新建一个数据库. 2.打开新建的My Sql数 ...
- windows进程中的内存结构[转载]
在阅读本文之前,如果你连堆栈是什么多不知道的话,请先阅读文章后面的基础知识. 接触过编程的人都知道,高级语言都能通过变量名来访问内存中的数据.那么这些变量在内存中是如何存放的呢?程序又是如何使用这些变 ...
- ios透明代理抓包
之前接到一些ios测试的时候,一些应用往往由于这样那样的原因(比如自实现的发包函数)导致直接使用本地ios系统的代理很难将数据代理到主机的burp或findler中,本文提供了一种解决该问题的途径 原 ...
- Spring的Lifecycle
Lifecycle接口定义了每个对象的重要方法,每个对象都有自己的生命周期需求,如下: public interface Lifecycle { void start(); void stop(); ...
- codeforces 519E A and B and Lecture Rooms LCA倍增
Time Limit:2000MS Memory Limit:262144KB 64bit IO Format:%I64d & %I64u Submit Status Prac ...
- Android自动化测试 - Robotium之Robotium在不同分辨率下clickonview不支持解决方案
使用Robotium中的clickonview方法进行点击操作时,可能在你本机上能够顺利执行,但把脚本移植到不同分辨率的设备下却有可能点不到控件的情况. 网上找了一些资料,基本一条语句可以搞定: 在m ...
- Codeforces 343D Water Tree(DFS序 + 线段树)
题目大概说给一棵树,进行以下3个操作:把某结点为根的子树中各个结点值设为1.把某结点以及其各个祖先值设为0.询问某结点的值. 对于第一个操作就是经典的DFS序+线段树了.而对于第二个操作,考虑再维护一 ...
- HIT2715 Matrix3(最小费用最大流)
题目大概说有一个n×n的矩阵,每个格子都有权值和高度,在这个矩阵中进行最多k次旅行,每次旅行能从当前格子走到相邻且高度更小的格子,走到格子边界就能出去完成这次旅行.每走到一个格子就累加格子的权值然后把 ...
- oracle视图
视图 SELECT -- int.rowner "rgroup owner", -- int.rname "refresh group", mv.owner a ...
- WPF之依赖属性
Introduction When you begin to develop appliations with WPF, you will soon stumble across Dependency ...