JS表单设计源码.docx
- 文档编号:3647285
- 上传时间:2022-11-24
- 格式:DOCX
- 页数:18
- 大小:18.83KB
JS表单设计源码.docx
《JS表单设计源码.docx》由会员分享,可在线阅读,更多相关《JS表单设计源码.docx(18页珍藏版)》请在冰豆网上搜索。
JS表单设计源码
1submit()方法把表单数据提交到Web服务器。
语法
formObject.submit()
说明
该方法提交表单的方式与用户单击Submit按钮一样,但是表单的onsubmit事件句柄不会被调用。
实例
functionformSubmit()
{
document.getElementById("myForm").submit()
}
Firstname:
Lastname:
2summary属性可设置或返回表格的概述。
summary属性为语音合成或非可视的浏览器规定了表格的概述。
语法
tableObject.summary=text
实例
下面的例子可返回表格的概述:
functionalertSummary()
{
alert(document.getElementById("table1").summary);
}
summary="Exampletableofemployees">Firstname Lastname
value="Alerttablesummary"/> 3systemLanguage属性可返回操作系统使用的默认语言。 语法 navigator.systemLanguage 实例
document.write("
SystemLanguage:
")
document.write(navigator.systemLanguage+"
")4tabIndex属性可为链接设置或返回tab键控制次序。
语法
anchorObject.tabIndex=tabIndex
实例
下面的例子可更改三个链接的tab键控制次序:
functionchangeTabIndex()
{
document.getElementById('1').tabIndex="3"
document.getElementById('2').tabIndex="2"
document.getElementById('3').tabIndex="1"
}
value="ChangeTabIndex"/> 5tabIndex属性可设置或返回某个区域的tab键控制次序。 语法 areaObject.tabIndex=tabIndex 实例 下面的例子可展示图像映射中区域的tab键控制次序:
functionshowTabIndex()
{
varsun=document.getElementById('sun').tabIndex;
varmercury=document.getElementById('mercury').tabIndex;
varvenus=document.getElementById('venus').tabIndex;
document.write("TabindexofSun:
"+sun);
document.write("
");
document.write("TabindexofMercury:
"+mercury);
document.write("
");
document.write("TabindexofVenus:
"+venus);
}
width="145"height="126" alt="Planets" usemap="#planetmap"/> href="sun.htm"id="sun"tabIndex="1"/> href="mercur.htm"id="mercury"tabIndex="2"/> href="venus.htm"id="venus"tabIndex="3"/> value="ShowtabIndex"/> 6tabIndex属性可设置或返回按钮的tab键控制次序。 语法 buttonObject.tabIndex=tabIndex 实例 下面的例子将返回按钮的tab键控制次序: functionshowTabIndex() { varb1=document.getElementById('b1').tabIndex; varb2=document.getElementById('b2').tabIndex; varb3=document.getElementById('b3').tabIndex; document.write("TabindexofButton1: "+b1); document.write(" document.write("TabindexofButton2: "+b2); document.write(" document.write("TabindexofButton3: "+b3); } value="ShowtabIndex"/> 7tabIndex属性设置或返回密码域的tab键控制次序。 语法 passwordObject.tabIndex=number 实例 下面的例子可显示表单元素的tab键控制次序: functionshowTabIndex() { varemail=document.getElementById('email').tabIndex; varpwd=document.getElementById('pwd').tabIndex; document.write("Tabindexofemailfield: "+email); document.write(" document.write("Tabindexofpasswordfield: "+pwd); }
");
");
");
Email:
Password:
8tabIndex属性可设置或返回按钮的tab键控制次序。
语法
buttonObject.tabIndex=tabIndex
实例
下面的例子可返回按钮的tab键控制次序:
functionshowTabIndex()
{
varb1=document.getElementById('b1').tabIndex;
varb2=document.getElementById('b2').tabIndex;
varb3=document.getElementById('b3').tabIndex;
document.write("TabindexofButton1:
"+b1);
document.write("
");
document.write("TabindexofButton2:
"+b2);
document.write("
");
document.write("TabindexofButton3:
"+b3);
}
value="ShowtabIndex"/> 9tabIndex属性可设置或返回单选按钮的tab键控制次序。 语法 radioObject.tabIndex=number 实例 下面的例子可显示出单选按钮的tabindex:
functionshowTabIndex()
{
varr1=document.getElementById('radio1').tabIndex;
varr2=document.getElementById('radio2').tabIndex;
varr3=document.getElementById('radio3').tabIndex;
document.write("Tabindexofradiobutton1:
"+r1);
document.write("
");
document.write("Tabindexofradiobutton2:
"+r2);
document.write("
");
document.write("Tabindexofradiobutton3:
"+r3);
}
10tabIndex属性可设桌返回下拉列表中的tab键控制次序。
语法
selectObject.tabIndex=number
实例
下面的例子将显示出一个文本框和一个下拉列表的tab键控制次序:
functionshowTabIndex()
{
varemail=document.getElementById('email').tabIndex;
varsex=document.getElementById('sex').tabIndex;
document.write("Tabindexofemailfield:
"+email);
document.write("
");
document.write("Tabindexofdropdownlist:
"+sex);
}
11属性可设置或返回确认按钮的tab键控制次序。
语法
submitObject.tabIndex=tabIndex
实例
下面的例子可显示表单元素的tab键控制次序:
functionshowTabIndex()
{
varemail=document.getElementById('email').tabIndex;
varr1=document.getElementById('submit1').tabIndex;
document.write("Tabindexofemail:
"+email);
document.write("
");
document.write("Tabindexofsubmitbutton:
"+r1);
}
12tabIndex属性设置或返回文本域的tab键控制次序。
语法
textObject.tabIndex=number
实例
下面的例子显示出不同文本域的tab键控制次序:
functioncheckTab(x)
{
alert(x.tabIndex)
}
13tableLayout属性用来显示表格单元格、行、列的算法规则。
固定表格布局:
固定表格布局与自动表格布局相比,允许浏览器更快地对表格进行布局。
在固定表格布局中,水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距,而与单元格的内容无关。
通过使用固定表格布局,用户代理在接收到第一行后就可以显示表格。
自动表格布局:
在自动表格布局中,列的宽度是由列单元格中没有折行的最宽的内容设定的。
此算法有时会较慢,这是由于它需要在确定最终的布局之前访问表格中所有的内容。
语法:
Object.style.tableLayout=automatic|fixed
可能的值
值
描述
automatic
默认。
列宽度由单元格内容设定。
fixed
列宽由表格宽度和列宽度设定。
实例
本例设置固定表格布局:
functionsetFixedTableLayout()
{
document.getElementById('myTable').style.tableLayout="fixed";
}
value="Setfixedtablelayout"> 14taintEnabled()方法可返回一个布尔值,该值声明了当前浏览器是否启用了datatainting。 语法 navigator.taintEnabled() 实例 下面的例子讲返回当前浏览器是否已启用datatainting的布尔值:
alert(navigator.taintEnabled())
输出:
false
15target事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。
语法
event.target
实例
下面的例子可获得触发事件的元素:
functiongetEventTrigger(event)
{
x=event.target;
alert("Theidofthetriggeredelement:
"
+x.id);
}
Clickonthisparagraph.Analertboxwill
showwhichelementtriggeredtheevent.
16target属性可设置或返回在何处打开链接。
语法
anchorObject.target=_blank|_parent|_self|_top
四个保留的目标名称:
∙_blank-在一个新的未命名的窗口载入文档
∙_self-在相同的框架或窗口中载入目标文档
∙_parent-把文档载入父窗口或包含了超链接引用的框架的框架集
∙_top-把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架
实例
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- JS 表单 设计 源码