0
点赞
收藏
分享

微信扫一扫

Html之【Text文本框】综合技巧大全(持续更新中...)


一、如何将文本框里的文字垂直居中?

    加入 verticla-align、line-height 两个属性后,文本框中的文字就在文本框中垂直居中了,要注意的是 line-height 必须要等于 height



<html>  
<head>
<style type="text/css">
#text {
height:20px;
vertical-align:middle;
line-height:20px; /*line-height must be equal to height*/
/* padding:8px 0 0 15px;  通过这个调整也可以*/
}
</style>
</head>
<body>
<table>
<input type="text" id="text">
</table>
</body>
</html>

二、文本框中限制输入字符数

在HTML网页中,要想textbox的长度随着输入的字符增多而变长,可以用到CSS的overflow属性。

如下:



Html之【Text文本框】综合技巧大全(持续更新中...)_文本框< input  name ="test"  type ="text"  style ="overflow:visible"  size ="10"  maxlength ="50" >



请注意要加上合适的maxlength限制,不然的话整个版面将会被撑得很难看。

overflow属性规定当元素里的内容超出显示范围,应该怎样应对。

三、用Jquery改变或清空Text中的值

     $("#Text1").val("");

四、限制文本框只能输入【数字】

方法1:输入中,如果出现字母,自动清空!

     <input οnkeyup="if(isNaN(value))execCommand('undo')" onafterpaste="if(isNaN(value))execCommand('undo')">

方法2:离开文本框时,提示:

   <input  maxlength="2"name="text" id="Text4" class="inputsty1" οnchange="if(/\D/.test(this.value)){alert('只能输入数字');this.value='';}"/>

五、Jquery控制文本框和焦点



$("#Text1").val("公交"); //赋值

$("#Text1").val(""); //清空

var mbt = $("#Text1").val(); // 获取值

$(#Text1”)[0].focus()// 文本框获得焦点


举报

相关推荐

0 条评论