文本框获得焦点时，显示旁边的文字

Posted 2023-05-16

asp.net
我有一个注册的文本框，和一个文本
当我点击这个文本框时，就会在这个文本
这个文本显示的是“登录名是4－20位数字或者是字母组成”，
一直到我输入完成后，我点击其它的地方，这个提示就会消失，
它会校验注册名是否合格，
请问js如何写代码，完整的代码。

参考技术A 可以用类似的ToolTip控件，当鼠标移动到文本的时候，下鼠标下显示需要的文字，移开后消失 参考技术B 试试Input里面的这样事件，onkeyup、onblur、onkeypress、onmousemove.......还有很多，你可要慢慢去试，就是当触发它的某个事件是发生的方法，直接调用就行了！ 参考技术C <input type=“text” onfocus="tooltip.show('字符串');" onblur="tooltip.hide();" />
下面是js文件:
var tooltip=function()
var id = 'tt';
var top = 3;
var left = 3;
var maxw = 240;
var speed = 10;
var timer = 20;
var endalpha = 95;
var alpha = 0;
var tt,t,c,b,h;
var ie = document.all ? true : false;
return
show:function(v,w)
if(tt == null)
tt = document.createElement('div');
tt.setAttribute('id',id);
t = document.createElement('div');
t.setAttribute('id',id + 'top');
c = document.createElement('div');
c.setAttribute('id',id + 'cont');
b = document.createElement('div');
b.setAttribute('id',id + 'bot');
tt.appendChild(t);
tt.appendChild(c);
tt.appendChild(b);
document.body.appendChild(tt);
tt.style.opacity = 0;
tt.style.filter = 'alpha(opacity=0)';
document.onmousemove = this.pos;

tt.style.display = 'block';
c.innerhtml = v;
tt.style.width = w ? w + 'px' : 'auto';
if(!w && ie)
t.style.display = 'none';
b.style.display = 'none';
tt.style.width = tt.offsetWidth;
t.style.display = 'block';
b.style.display = 'block';

if(tt.offsetWidth > maxw)tt.style.width = maxw + 'px'
h = parseInt(tt.offsetHeight) + top;
clearInterval(tt.timer);
tt.timer = setInterval(function()tooltip.fade(1),timer);
,
pos:function(e)
var u = ie ? event.clientY + document.documentElement.scrollTop : e.pageY;
var l = ie ? event.clientX + document.documentElement.scrollLeft : e.pageX;
tt.style.top = (u - h) + 'px';
tt.style.left = (l + left) + 'px';
tt.style.zIndex = 9999999999;
,
fade:function(d)
var a = alpha;
if((a != endalpha && d == 1) || (a != 0 && d == -1))
var i = speed;
if(endalpha - a < speed && d == 1)
i = endalpha - a;
else if(alpha < speed && d == -1)
i = a;

alpha = a + (i * d);
tt.style.opacity = alpha * .01;
tt.style.filter = 'alpha(opacity=' + alpha + ')';
else
clearInterval(tt.timer);
if(d == -1)tt.style.display = 'none'

,
hide:function()
clearInterval(tt.timer);
tt.timer = setInterval(function()tooltip.fade(-1),timer);

;
();本回答被提问者采纳

javascript中怎么设置文本框获得焦点

代码如下:
<input name="pwuser" type="text" id="pwuser" class="input" value="楼盘账号" onBlur="if(this.value==\'\') this.value=\'楼盘账号\';" onFocus="if(this.value==\'楼盘账号\') this.value=\'\';" />
<input name="pwpwd" type="password" class="input1" value="******" onBlur="if(this.value==\'\') this.value=\'******\';" onFocus="if(this.value==\'******\') this.value=\'\';">

jquery实现方法

对于元素的焦点事件，我们可以使用jQuery的焦点函数focus(),blur()。

focus()：得到焦点时使用，和javascript中的onfocus使用方法相同。
如：

代码如下:

$("p").focus(); 或$("p").focus(fn)

blur()：和onblur一样。
如：

代码如下:

$("p").blur(); 或$("p").blur(fn)

实例

代码如下:

<form>
<label for="searchKey" id="lbSearch">搜神马？</label> 这里label覆盖在文本框上，可以更好的控制样式
<input id="searchKey" type="text" />
<input type="submit" value="搜索" />
</form>

jquery代码

代码如下:

$(function()
$(\'#searchKey\').focus(function()
$(\'#lbSearch\').text(\'\');
);
$(\'#searchKey\').blur(function()
var str = $(this).val();
str = $.trim(str);
if(str == \'\')
$(\'#lbSearch\').text(\'搜神马？\');
);
) 参考技术A 复制代码 代码如下:
var obj=document.getElementById("txtUserID")
var range=obj.createTextRange()
//选中文本的起始位置（从第3个字符之后开始）
range.moveStart("character",3)
//选中文本的结束位置（到全部字符的倒第3个之前）
range.moveEnd("character",-3)
//选中
range.select()