Chinese
Sign in / Sign up

Javascript文本框对象

如何用 javascript 将鼠标指针转到文本框上？
或
表单控件类型单行文本框有哪些相关的事件？

解释

HTML 表单单行文本框对象基础知识
文本框对象 :
如下语法演示获取表单上的文本框
语法: document.formname.textname
示例代码:
<form name=testform>
<input name=textn value=测试 type=text>
</form>
<script language="javascript">
var cbobject= document.testform.textn;
</script>

这里是与文本框有关的事件、 dom 属性和方法。
事件句柄: 与表单控件类型文本框相关:
如下所有示例使用了 javascript 自定义函数 output
<script language=javascript>
function output()
{
alert("测试文本框事件");
}
</script>
事件 说明 示例
onMouseOver 当鼠标指针移动到单行文本框上的时候触发 <input type=text onMouseOver="output()">
结果：
onMouseDown 当在单行文本框上按下鼠标的时候触发 <input type=radio onMouseDown="output()">
结果：
onMouseUp 当在单行文本框上释放鼠标的时候触发 <input type=text onMouseUp="output()">
结果：
onClick onClick 函数当用鼠标点击单行文本框后触发 <input type=text onClick="output()">
结果：
onBlur 当 通过按 Tab 键等方式让单行文本框失去焦点时触发 <input type=text onBlur="output()">
结果：
onFocus 当 通过按 Tab 键等方式让单行文本框获得焦点时触发 <input type=text onFocus="output()">
结果：

DOM 属性:
如下是 DOM (文档对象模型 Dynamic Object Model) 中定义的属性列表 可用于在 javascript 中获取或修改单行文本框属性。
下面的示例代码基于表单
<form name=form1>
<input name=testf type=text value=xxx>
</form>
DOM 属性 说明 示例
defaultValue 用于检查是否有默认值 获取时用：
var ss = document.form1.textf.defaultValue;
form 用户获取单行文本框的上级对象（即表单对象） 获取时用：
var ss = document.form1.textf.form;
name 用于获取单行文本框对象的名称 获取时用：
var ss = document.form1.textf.name;
type 用于获取表单控件类型 获取时用：
var ss = document.form1.textf.type;
value 用于设置或者获取单行文本框的值 获取时用：
var ss = document.form1.textf.value;
设置时用：
document.form1.textf.value = "testy";
size 用于设置或者获取单行文本框的大小 获取时用：
var ss = document.form1.textf.size;
设置时用：
document.form1.textf.size = 4;
readOnly 用于设置或者获取单行文本框的只读状态，当只读状态时，用户无法输入或改变文本框的值。 检查时用:
var ss = document.form1.textf.readOnly;
设置时用：document.form1.textf.readOnly = true;

DOM 方法:
如下是 DOM (文档对象模型 Dynamic Object Model) 中定义的方法列表 用于在 javascript 中完成动态修改如单行文本框选择事件等代码。
DOM 方法 说明 示例
select() 用于动态让单行文本框选择文本 选择时用:
document.form1.textf.select();
blur() 用于动态让单行文本框失去焦点 失去焦点时用:
document.form1.textf.blur();
focus() 用于动态让单行文本框获取焦点 赋予焦点时用:
document.form1.textf.focus();

示例: 当鼠标移动到单选框上时让它得到焦点，并变更只读状态
<script language=javascript>
function rbevent()
{
var xx = document.xx.testtext.focus();
}
</script>

<form name=xx>
<input type=text name=testtext"> <input type=button name=rbtest onMouseOver="rbevent()">
</form>
结果:

上一頁下一頁

Java Script 教程