仓酷云

标题: 来讲讲：用tabIndex轻松完成网页导航 [打印本页]

作者: 不帅 时间: 2015-1-16 00:23
标题: 来讲讲：用tabIndex轻松完成网页导航
样式的调整更加方便。内容和样式的分离，使页面和样式的调整变得更加方便。
比来，当我在一个网站上输出表格数据时，我填写了一栏，并点击[Tab]键移到下一栏；当我仰面时，我惊异的发明光标跳到页面下方的另外一栏中。我用鼠标将光标移到准确的文本栏中，但不久[Tab]键又再次呈现成绩。这一情况使我想懂得一下页面计划，和tabIndex属性怎样经由过程键盘匡助导航。
经由过程[Tab]键会见元素
HTMLDOMtabIndex特征同意你设置或前往一个HTML元素的tab键按次。IE4.0开始撑持此特征。后来，只要真正可经由过程[Tab]键会见的元素遭到撑持，如输出栏、链接等。现在，一切的收集扫瞄器，和页面上显现的一切元素都撑持此特征。在使用它之前，你能够双击HTML标准包管某个元素撑持此特征。
tabIndex特征
使用tabIndex特征是一个复杂而又间接的历程。比方，上面的HTML源代码将tabIndex值1赋值给输出栏，它是tab按次的第一栏：
<inputid="idfname"name="firstName"tabindex="1"/>
假如最后选择了[Tab]键，带这个输出栏的网页会将光标挪动到firstName栏。
在给tabIndex特征赋值时，要寄望几个成绩。上面是几个赋值划定规矩：

带0值tabIndex的元素依据源代码（或默许页面举动）举行排序。
年夜于0的tabIndex值设定其tab按次。一切带正tabIndex值的元素呈现在一切带0tabIndex值的元素之前。
假如你犯了一个毛病，把统一个tabIndex付与给多个元素，像别的元素一样，它们会以一个0值tabIndex举行处置。
将tabIndex赋值为-1，则在利用[Tab]键时，此元素被疏忽。注重：假如利用-1值时，onfocus与onblur事务仍被启动。
tabIndex的值可为0至32767之间的恣意数字。

列表A中的样本HTML代码将一个tabIndex值付与给页面中的每个项目。输出栏与DIV标签包括tabIndex特征，同意用户用键盘细心浏览页面元素。（DIV标签其实不供应与取得核心有关的太多信息，但我想用非输出元素申明tabIndex的使用情形。）值为-1的按钮被赋值，在使用[Tab]键时，它们即被疏忽。
当输出元素充斥（到达最年夜长度）时，你能够增添一小段JavaScript剧本来完成主动定位功效。这是一个基础的函数，我们来看看剧本怎样完成其功效：
functioncheckLen(x,y){
if(y.length==x.maxLength){
varnext=x.tabIndex
if(next<document.getElementById("frmTest").length){
document.getElementById("frmTest").elements[next-1].focus()
}}}
该函数承受两个变量。第一个变量为输出栏，第二个变量包括该栏的值。并将栏的长度与栏的可承受最年夜长度比拟较。假如它们相称（即该栏是充斥的），则从栏中读取tabIndex的值；假如该值小于最年夜长度，则核心被挪动下一栏中。
此函数为每栏的onkeyup事务赋值，因而每次在栏中输出一个值，以查验其是不是到达最年夜长度时，都要挪用该函数。假如到达最年夜值，则光标按tab按次挪动到下一栏中。列表B中的源代码将此函数增加到下面的例子中。
进步会见才能
为元素指定tabIndex可匡助常常利用键盘的用户更加便利地打仗收集界面；非尺度用户，如PDA、挪动德律风和残疾人利用的屏幕浏览器也从中受害。任何扩大使用软件功效的事务都是无益的。
大事一桩
你大概要花很多工夫来计划收集窗体，使其具有视觉吸引力，并能被后端服务器组件准确处置。可是，你大概疏忽了要用非尺度手艺或扫瞄器对其举行测试。典范的例子就是保持鼠标，而依托键盘来导航窗体。HTML尺度包括tabIndex特征，它同意你把持经由过程[Tab]键会见的项目。
TonyPatton具有丰厚的Java、VB、Lotus及XML方面的常识，是一个专业的使用程序开辟职员。
</p>
你可以轻松地控制页面的布局。

作者: 第二个灵魂 时间: 2015-1-18 06:33
还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。

作者: 小女巫 时间: 2015-1-23 05:48
还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。

作者: 愤怒的大鸟 时间: 2015-1-31 15:33
还是在Dreamweaver所见即所得添加链接是，可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。

作者: 小妖女 时间: 2015-2-6 21:00
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

作者: 只想知道 时间: 2015-2-18 19:29
可以使用 CSS 检查工具进行设计。

作者: 飘飘悠悠 时间: 2015-3-6 09:44
时间轴)窗口--时间轴--选中图层并拖图层到时间轴,将其放在指定帧上

作者: 老尸 时间: 2015-3-20 07:27
直接用代码建立链接，如：可以直接输入 <a herf = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"red.html\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">红色的网页 12、插入标签法建立链接，可以再选中文字后在代码中插入html标签，页元素<a>.也可以按ctrl+t进入html标签插入方法之后输入代码即可。

欢迎光临仓酷云 (http://www.ckuyun.com/)