DOM(九)使用DOM设置文本框

1.控制用户输入的字符个数
对于单行文本框和密码输入框,可以利用maxlength属性控制用户输入的字符个数。
对于多行文本,maxlength为自定义属性,其值最多输入的字符的个数,在onkeypress事件发生时则调运返回LessThan()函数返回值,函数如下

<textarea name="comments" id="comments" cols="40" rows="4" maxlength="50" onekeypress ="return LessThan(this);"></textarea>

详细代码

<script language="javascript">
function LessThan(oTextArea){
	//返回文本框字符个数是否符号要求的boolean值
	return oTextArea.value.length < oTextArea.getAttribute("maxlength");
}
</script>
<form method="post" name="myForm1" action="addInfo.aspx">
<p><label for="name">请输入您的姓名:</label>
<input type="text" name="name" id="name" class="txt" value="姓名" maxlength="10"></p>
<p><label for="comments">我要留言:</label><br>
<textarea name="comments" id="comments" cols="40" rows="4" maxlength="50" onkeypress="return LessThan(this);"></textarea></p>
<p><input type="submit" name="btnSubmit" id="btnSubmit" value="Submit" class="btn">
<input type="reset" name="btnReset" id="btnReset" value="Reset" class="btn"></p>
</form>

2.设置鼠标经过自动选择文本

首先是鼠标经过时自动聚焦 onmouseover = "this.focus"

其次是 onfocus = "this.select()"
代码实例:

<form method="post" name="form1" id="form1" action="addInfo.aspx">
<input type="text" name="name" id="name" class="txt" value="姓名" onmouseover="this.focus()" onfocus="this.select()">
</form>

对于多个代码实例,可以使用以下代码进行聚焦

<script type="text/javascript">
            function myFocus() {
                this.focus();
            }

            function mySelect() {
                this.select();
            }
            window.onload = function() {
                var oForm = document.forms["myForm1"];
                oForm.name.onmouseover = myFocus;
                oForm.name.onfocus = mySelect;
            }
        </script>
            <form method="post" name="myForm1" action="addInfo.aspx">
                <p>
                    <label for="name">请输入您的姓名:</label>
                    <input type="text" name="name" id="name" class="txt" value="姓名">
                </p>
                <p>
                    <label for="passwd">请输入您的密码:</label>
                    <input type="password" name="passwd" id="passwd" class="txt">
                </p>
                <p>
                    <input type="submit" name="btnSubmit" id="btnSubmit" value="Submit" class="btn">
                    <input type="reset" name="btnReset" id="btnReset" value="Reset" class="btn">
                </p>
            </form>
时间: 2024-10-11 10:44:11

DOM(九)使用DOM设置文本框的相关文章

jquery设置文本框值 与获取文本框的值

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <script src="../js/jquery-1.12.4.js"></script> </head> <body> <input type="tex

iOS不得姐项目--登录模块的布局,设置文本框占位文字颜色,自定义内部控件竖直排列的按钮

一.登录模块的布局 将一整部分切割成若干部分来完成,如图分成了三部分来完成 设置顶部状态栏为白色的方法 二.设置文本框占位文字颜色 <1>方法一与方法二实现原理是同一种,都是通过设置placeholder的NSAttributeString来设置文字属性 方法二效果图: <2>第三种方法是通过RunTime找到隐藏的可以设置placeholder颜色的属性,通过KVC来赋值.RunTime会单独拿出来讲 三.按钮自定义,重新排列子控件的排列位置

20140527-在jQuery中设置文本框回车事件

20140527-在jQuery中设置文本框回车事件 该代码要完成的效果是,用户在文本框输入完毕以后,按下回车键,立即触发"搜索"的单击事件. 例如: $("#search_user_name").keydown(function (e) {         // search_user_name为文本框ID         var curKey = e.which;         if (curKey == 13) {             // search

javascript设置文本框只能输入数字

javascript设置文本框只能输入数字:在很多实际需要中,需要对输入的内容进行限制,比如有些地方只能够输入数字,例如大家经常使用的QQ号码,这个当然当然是数字了,下面就简单介绍一下如何实现此功能.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.s

js设置文本框只读属性的小bug

在js中设置文本框为只读属性的时候 , document.getElementById('你文本框的id').readOnly=true; 如果页面刚开始加载, 该文本框就获得焦点了,只读属性就不成立,该文本框就可以被编辑. 所以需要加一行代码让页面加载时就失去该文本框的焦点, window.onload = function(){ document.getElementById('您文本框的id').blur(); document.getElementById('你文本框的id').read

spinner 设置文本框中的字体颜色

onItemSelected(AdapterView parent, View v, int position, long id) { TextView v1 = (TextView)v; v1.setTextColor(Color.WHITE); //可以随意设置自己要的颜色值 } 本文转自:http://bbs.csdn.net/topics/350049938 spinner 设置文本框中的字体颜色

纯 JS 设置文本框的默认提示

HTML5 中有个新特性叫 placeholder,一般用它来描述输入字段的预期值,适用于 text.search.password 等类型的 input 以及 textarea.示例如下: <input type="text" placeholder="请输入文本"><br> <input type="search" placeholder="请输入查询关键字"><br> &l

background 设置文本框背景图

background 属性的作用是给元素设置背景,它是一个复合属性,常用的子属性如下: background-color 指定元素的背景颜色. background-image 指定元素的背景图像. background-position 指定背景图像的位置,在复合属性中与 size 二选一. background-size 指定背景图片的尺寸,在复合属性中与 position 二选一. background-repeat 指定如何重复背景图像. 多数时候,我们都是给 div 等区块元素设置背景

改变设置文本框占位文字和图片

如果我们想实现这种效果,点击相应的文本,占位文字显示高亮 ,而其他文本框非高亮 相应代码 #import <UIKit/UIKit.h> @interface XMGTextField : UITextField /** 颜色 */ @property(nonatomic,strong)UIColor *placeholderColor; @end #import "XMGTextField.h" #import <objc/runtime.h> static