H I O X INDIA
提示窗口
 首页   ||  教程  ||  脚本  || 支持 english Español Français Deutsch Portuguese Japanese தமிழ்

JavaScript的教程
导言
变量
运营商
声明
循环
职能
物体
阵列
浏览器对象
表格的DOM
请询问您的疑问
反馈


在此页面反馈



名字:
邮件
反馈:
  




Javascript 多行文本框对象


主题

如何用 javascript 动态改变多行文本框的大小?
or
表单控件类型多行文本框有哪些相关的事件



解释
表单多行文本框对象基础知识

多行文本框对象 :
        如下语法演示获取表单上的多行文本框
语法: document.formname.textarea

示例代码:
<form name=testform>
<textarea name=textn > 测试多行文本框</textarea>
</form>

<script language="javascript">
var cbobject= document.testform.textn;
</script>

这里是与多行文本框有关的事件、 dom 属性和方法。

事件句柄: 与表单控件类型多行文本框相关:
如下所有示例使用了 javascript 自定义函数 output
<script language=javascript>
function output()
{
alert("testing TextArea");
}
</script>
事件 说明 示例
onMouseOver 当鼠标指针移动到多行文本框上的时候触发 <textarea name=textn onMouseOver="output()"> 测试多行文本框</textarea>

结果:
onMouseDown 当在多行文本框上按下鼠标的时候触发 <textarea name=textn onMouseDown="output()"> 测试多行文本框</textarea>

结果:
onMouseUp 当在多行文本框上释放鼠标的时候触发 <textarea name=textn onMouseUp="output()"> 测试多行文本框</textarea>

结果:
onClick onClick 函数当用鼠标点击多行文本框后触发 <textarea name=textn onClick="output()"> 测试多行文本框</textarea>

结果:
onBlur 通过按 Tab 键等方式让多行文本框失去焦点时触发 <textarea name=textn onBlur="output()"> 测试多行文本框</textarea>

结果:
onFocus 通过按 Tab 键等方式让多行文本框获得焦点时触发 <textarea name=textn onFocus="output()"> 测试多行文本框</textarea>

结果:



DOM 属性:
如下是 DOM (文档对象模型 Dynamic Object Model) 中定义的属性列表 可用于在 javascript 中获取或修改多行文本框属性。
下面的示例代码基于表单
<form name=form1>
<textarea name=textn> 测试多行文本框</textarea>
</form>

DOM 属性 说明 示例
defaultValue 用于检查是否有默认值 获取时用:
var ss = document.form1.textn.defaultValue;

form 用户获取多行文本框的上级对象(即表单对象) 获取时用:
var ss = document.form1.textn.form;

name 用于获取多行文本框对象的名称 获取时用:
var ss = document.form1.textn.name;

type 用于获取表单控件类型 获取时用:
var ss = document.form1.textn.type;

value 用于设置或者获取多行文本框的值 获取时用:
var ss = document.form1.textn.value;

设置时用:
document.form1.textn.value = "testy";
size 用于设置或者获取多行文本框的大小 获取时用:
var ss = document.form1.textn.size;

设置时用:
document.form1.textn.size = 4;
readOnly 用于设置或者获取多行文本框的只读状态,当只读状态时,用户无法输入或改变文本框的值。 检查时用:
var ss = document.form1.textn.readOnly;

设置时用:
document.form1.textn.readOnly = true;

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

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

<form name=xx>
<textarea name=testarea> 测试多行文本框</textarea>
<input type=button name=rbtest onMouseOver="rbevent()">
</form>

结果:




        使用Javascript (爵士)是一种最常用的语言在世界上. 有时拼写为Java脚本. 希望您喜欢本教程. 不要发送您的意见或建议在此JavaScript或Java脚本教程. 这是一个版权内容.

privacy policy     license    
© 2004-2010 HIOX INDIA - hioxindia.com

其它链接