输入框默认文字点击消失

港控/mmm° 2022-08-13 15:56 276阅读 0赞

使用javascript完成：

代码：

<script language="javascript" type="text/javascript">
    window.onload = function(){
    	var o = document.getElementById("searchKey");
    	o.setAttribute("valueCache", o.value);
    	o.onblur = function(){
    		if(o.value == ""){
    			o.valueCache = "";
    			o.value = o.tips;
    		}else{
    			o.valueCache = o.value;
    		}
    
    		o.onfocus = function(){
    			o.value=o.valueCache;
    			//光标始终在文字最后
    			var e = event.srcElement;
    			var r =e.createTextRange();
    			r.moveStart('character',e.value.length);
    			r.collapse(true);
    			r.select();
    		}
    		o.onblur();
    	}
    }

上面的方法是个坑，写了一大堆还是不行。

大道至简

点击输入框后变成755D

<input name="destZoneCode" id="destZoneCode" class="text"  value="请输入目的地代码" onFocus="this.value='755D'" style="width: 200px" type="text" size="40" />

点击输入框后置空

<input name="destZoneCode" id="destZoneCode" class="text"  value="请输入目的地代码" onFocus="this.value=''" style="width: 200px" type="text" size="40" />

发表评论取消回复

表情：

评论列表（有 0 条评论，276人围观）

还没有评论，来说两句吧...

相关阅读

相关 C#下设置TextBox默认显示文字，点击后消失

TextBox的ID为account和password //用户输入 account.Attributes.Add("Value", "

绝地灬酷狼/ 2022年08月19日 13:24/ 0 赞/ 196 阅读

相关输入框默认文字点击消失

使用javascript完成：代码： <script language="javascript" type="text/javascript">

港控/mmm°/ 2022年08月13日 15:56/ 0 赞/ 277 阅读

相关 swing 点击输入框去除文字

给文本框设置鼠标单击监听，再进行清空文本操作 import java.awt.event.MouseAdapter; import java.awt.event.Mo

我就是我/ 2022年06月15日 10:22/ 0 赞/ 289 阅读

相关模态框点击空白处不消失

代码： <div class="modal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="s

- 日理万妓/ 2022年06月02日 03:39/ 0 赞/ 354 阅读

相关 HTML、css——设置文本框中的默认字体颜色和点击输入的文本字体颜色不一致；并且点击文本框，文本框边框消失；输入内容时，默认字体消失。

html代码：功能：点击输入的文本字体颜色的设置，并且输入内容时，文本框里的默认字消失。 <input type="text" placeholder="手机号、

冷不防/ 2022年05月14日 02:24/ 0 赞/ 235 阅读

相关 bootstrap模态框，使点击空白地方模态框不消失

正常情况下  <div class="modal fade" id="myModal" tabindex="-1" role="d

末蓝、/ 2022年03月16日 08:36/ 2 赞/ 873 阅读

相关常见输入框的验证及点击清空输入框

效果图 ![在这里插入图片描述][20190425193835157.png] input框内输入内容后显示删除图标，并实现点击图标清空input内容 ![在这里

青旅半醒/ 2022年02月14日 04:53/ 0 赞/ 644 阅读

相关 input输入框点击回车切换到下一个输入框功能

直接上代码： HTML： <form class="layui-form" action="../in" id="form" method="post" name=

逃离我推掉我的手/ 2022年02月01日 23:34/ 0 赞/ 1023 阅读

相关 bootstrap 模态框禁用点击空白处消失和禁用按ESC消失

方法一： JS控制的方式 $('myModal').modal({ backdrop: 'static', //禁用点击空白处消失 keyboard

绝地灬酷狼/ 2021年12月09日 05:47/ 0 赞/ 446 阅读

相关点击增加输入框

js: function insertTag(num)\{ var address=document.getElementById("tag"); var i=a

朱雀/ 2021年09月10日 06:58/ 0 赞/ 495 阅读