Tab键

最新推荐文章于 2023-03-27 19:53:01 发布
最新推荐文章于 2023-03-27 19:53:01 发布
阅读量645 收藏
点赞数
分类专栏： javascript 
<script type="text/javascript"> 
<!-- 
function swap_tab(n){ 
    for(var i=1;i<=4;i++){ 
        var curC=document.getElementById("tab_"+i); 
        var curB=document.getElementById("tab_t"+i); 
        if(n==i){ 
            curC.style.display="block"; 
            curB.className="hover";
        }else{ 
            curC.style.display="none"; 
            curB.className="";
        } 
    } 
} 
//--> 
</script> 

<div id="lib_Tab1">
<div class="lib_Menubox lib_tabborder">

<ul>
<li class="hover" id="tab_t1" οnmοuseοver="return swap_tab(1)">报名奖</li>
<li id="tab_t2" οnmοuseοver="return swap_tab(2)" class="">幸运奖</li>
<li id="tab_t3" οnmοuseοver="return swap_tab(3)" class="">购车奖</li>
<li id="tab_t4" οnmοuseοver="return swap_tab(4)" class="">厂商回馈奖</li>
</ul>
</div>
<div class="lib_Contentbox01 lib_tabborder">
<div id="tab_1" style="display: block;">
<div class="bmlist">
<table cellspacing="0" cellpadding="0" border="0" class="tb2">
<tbody>
<tr>
<th width="96">序列</th>
<th>姓名</th>
<th>性别</th>
<th width="175">手机</th>
<th width="332">所在城市</th>

</tr>
<tr>
<td class="bk_bg">01</td>
<td width="147">兰**</td>
<td width="128" class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>

</tr>
<tr>
<td class="bk_bg01">02</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">03</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">04</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">05</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">06</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">07</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>


</tbody>
</table>
</div>
</div>
<div style="display: none;" id="tab_2">
<div class="bmlist">
<table cellspacing="0" cellpadding="0" border="0" class="tb2">
<tbody>
<tr>
<th width="96">序列</th>
<th>姓名</th>
<th>性别</th>
<th width="175">手机</th>
<th width="332">所在城市</th>

</tr>
<tr>
<td class="bk_bg">01</td>
<td width="147">兰**</td>
<td width="128" class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>

</tr>
<tr>
<td class="bk_bg01">02</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">03</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">04</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">05</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">06</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">07</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>


</tbody>
</table>
</div>
</div>
<div style="display: none;" id="tab_3">
<div class="bmlist">
<table cellspacing="0" cellpadding="0" border="0" class="tb2">
<tbody>
<tr>
<th width="96">序列</th>
<th>姓名</th>
<th>性别</th>
<th width="175">手机</th>
<th width="332">所在城市</th>

</tr>
<tr>
<td class="bk_bg">01</td>
<td width="147">兰**</td>
<td width="128" class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>

</tr>
<tr>
<td class="bk_bg01">02</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">03</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">04</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">05</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">06</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">07</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>


</tbody>
</table>
</div>
</div>


<div style="display: none;" id="tab_4">
<div class="bmlist">
<table cellspacing="0" cellpadding="0" border="0" class="tb2">
<tbody>
<tr>
<th width="96">序列</th>
<th>姓名</th>
<th>性别</th>
<th width="175">手机</th>
<th width="332">所在城市</th>

</tr>
<tr>
<td class="bk_bg">01</td>
<td width="147">兰**</td>
<td width="128" class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>

</tr>
<tr>
<td class="bk_bg01">02</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">03</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">04</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">05</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg01">06</td>
<td> 兰** </td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>
<tr>
<td class="bk_bg">07</td>
<td> 兰**</td>
<td class="tl"><b> 男</b></td>
<td> 1357892****</td>
<td> 北京市朝阳区</td>
</tr>


</tbody>
</table>
</div>
</div>
</div>
<script type="text/javascript"> 
<!-- 
function swap_tab(n){ 
    for(var i=1;i<=4;i++){ 
        var curC=document.getElementById("tab_"+i); 
        var curB=document.getElementById("tab_t"+i); 
        if(n==i){ 
            curC.style.display="block"; 
            curB.className="hover";
        }else{ 
            curC.style.display="none"; 
            curB.className="";
        } 
    } 
} 
//--> 
</script> 
</div>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>测试Tab</title>
<style type="text/css"> 
<!-- 
.Menu { 
    font-size: 12px; 
    width: 200px; 
    float: left; 
    border: 1px solid #CCCCCC; 
} 
ul { 
    margin: 0px; 
    padding: 0px; 
} 
.Menu ul li { 
    list-style-type: none; 
    height: 24px; 
    text-align: center; 
    line-height: 24px; 
} 
.Menu li a, .Menu li a:active { 
    border-bottom:1px solid #cccccc; 
    display: block; 
    height: 24px; 
    width: 200px; 
    text-decoration: none; 
}
.content .textList li { 
    list-style-type: none; 
} 
.content { 
    width: 500px; 
    margin-left: 210px; 
} 
.content .textList { 
    border: 1px solid #CCCCCC; 
    height: 500px; 
} 
.current{
    background:#F42D2D;
}
--> 
</style> 
<script type="text/javascript"> 
<!-- 
//Tab切换
function switch_tab(n){ 
    for(var i=1;i<=4;i++){ 
        var curC=document.getElementById("tab_"+i); 
        var curB=document.getElementById("tab_t"+i); 
        if(n==i){ 
            curC.style.display="block"; 
            curB.className="current";  
        }else{ 
            curC.style.display="none"; 
            curB.className="";  
        } 
    } 
} 
//--> 
</script> 
</head>
<body> 
<div class="Menu"> 
    <ul> 
        <li οnmοuseοver="return switch_tab(1);" id="tab_t1" class='current'><a href="#">栏目导航1</a></li> 
        <li οnmοuseοver="return switch_tab(2);" id="tab_t2"><a href="#">栏目导航2</a></li> 
        <li οnmοuseοver="return switch_tab(3);" id="tab_t3"><a href="#">栏目导航3</a></li> 
        <li οnmοuseοver="return switch_tab(4);" id="tab_t4"><a href="#">栏目导航4</a></li> 
    </ul> 
</div> 
<div class="content"> 
    <div id="tab_1"><div class="textList">栏目内容1</div></div> 
    <div id="tab_2" style='display:none;'><div class="textList">栏目内容2</div></div>
    <div id="tab_3" style='display:none;'><div class="textList">栏目内容3</div></div>
    <div id="tab_4" style='display:none;'><div class="textList">栏目内容4</div></div>
</div> 
</body> 
</html>




陌阡
关注
专栏目录
html怎么键tab键,html中控制Tab键的顺序
weixin_36168927的博客
07-08 2442
在做项目中，需要控制html页面上登陆表单的按Tab键的顺序，代码如下：账 号：昵称：备注：这里的tabIndex的值可为0至32767之间的任意数字当浏览者使用TAB键在网页控件中移动时，将首先移动到具有最小tabIndex属性值的控件上，最后在具有最大tabIndex属性值 的控件上结束移动。如果有两个控件的tabIndex属性相同，则以控件在html代码中出现的顺序为准。默认的tabInde...
vs快捷键 switch tab tab enter 自动填充枚举类型
qq319923400的博客
03-10 4721
先switch然后两下tab 会补完到default，光标显示在switch后的变量 这时输入枚举，输完后回车，补完所有枚举的case
html怎么键tab键,tab键的html
weixin_30674575的博客
07-08 1629
tab键的html 内容精选换一换浏览器访问测试。 在/usr/share/nginx/html目录下创建“info.php”的测试页面。 执行以下命令创建并打开“info.php”的测试文件。 vim /usr/share/nginx/html/info.php 按i键进入编辑模式。 修改打开的“info.php”文件，将如下内容写入文件。CLI工具的命令兼容性，列举支持和禁用的命令列表，命令的...
Word——设置Tab键宽度
Williamcsj的博客
07-13 5066
设置tab键宽度
tab键补全命令
黑乎乎的小升
03-27 1379
在命令行输入命令的时候，首先输入前面的几个字符，这时按下TAB键，如果该命令是唯一的，那么就会自动补全，如果该命令有很多个，那么需要再按一下TAB键，这时会显示出所有可能的情况，操作者只需要再补几个字母使命令唯一后再按一次TAB键，命令就会补全了。它的原理是通过查找磁盘内已经存在的文件或是命令来实现。如需使用tab键补全需要安装bash-completion软件包，安装完成即可使用。一个可以减少失误，并且省时省力的小工具。
html中tab键的用法,利用Tab键快速创建html
weixin_29337389的博客
06-10 2964
如何快速创建html模版输入：! 或者 html:5 或者 html:4s 或者 html:4t 将自动补全html基本结构嵌套操作1.使用“>”生成子元素// 输入div>ul>li// 按下TAB键2.使用“+”生成兄弟元素// 输入div+p+bq// 按下TAB键3.使用“^”生成父元素// 输入div+div>p>span+em^bq// 按下TAB键4.使...
计算机键盘上的tab键是什么键,键盘Tab键有什么作用?
热门推荐
weixin_36369656的博客
07-28 2万+
Tab键——跳格键，大家都比较熟悉了吧，但是到底它有什么特殊的使用功能，却未必是大家都知道的哦。今天就将Tab键的几种使用功能进行了整理，大家可以参考学习学习。1、跳格。当我们在网页输入表单的时候，在一个输入控件完成内容输入后，如果要转移到下一个控件进行输入时，可以选择使用鼠标进行光标的移动选择和点击，使得光标停在我们输入框中，以便进行内容的输入。如果不使用鼠标的话，可以点击使用Tab键，来实现光...
计算机键盘上的tab键是什么键,电脑Tab键有什么用处
weixin_34749016的博客
07-28 1万+
电脑Tab键有什么用处Tab键对大家来说都是比较熟悉吧。比如写文章时开头要空两格就可用这个键。但是它还有什么特殊功能呢，不一定是大家都知道的。下面小编来详细的介绍下几种tab键的常见用处：tab键作用一：改变焦点聚焦到下一个按钮，输入框或者链接等。例如，关闭一个未保存的记事本，会弹出一个提示，此时，“是”按钮上有一个虚线框，如果按下空格或者回车就相当于用鼠标点击了“是”按钮。想用键盘来“点击”“否...
php tab 键,微型计算机键盘上的Tab键是什么键？
weixin_42294495的博客
04-11 918
微型计算机键盘上的Tab键是：制表定位键。在电脑键盘上，Tab键是制表键(tabulator key)或表格键(tabular key)的缩写，用以将游标推进到下一个定位点上。在电脑键盘上，Tab键(制表键(tabulator key)或表格键(tabular key)的缩写)用以将游标推进到下一个定位点上。“Tab”一词由英文“tabulate”派生而来，意思是“以表格、或表格形式排列数据”。在...
windows adb shell tab键补全
03-15
而在Windows的CMD（命令提示符）窗口中，我们可以利用`tab`键的补全功能来提高命令输入的效率。下面将详细讲解如何在Windows CMD中使用`adb shell`及`tab`键补全功能。 1. **adb简介** `adb`是Android SDK的一部分...
javascript实现textarea中tab键的缩排处理方法
10-24
在编程环境中，用户经常需要使用Tab键进行代码的缩进，以便于代码的格式化和可读性。然而，HTML的textarea元素默认并不支持按下Tab键时自动缩进的功能，而是将焦点切换到下一个表单元素。为了解决这个问题，我们可以...
javascript禁用Tab键脚本实例
10-26
在某些场景下，开发者可能需要禁用用户使用Tab键进行元素间的跳转，以实现特定的用户界面行为。本文将深入讲解如何使用JavaScript来禁用Tab键，并提供一个实际的代码示例。 在HTML中，Tab键通常用于让用户在表单...
解析ubuntu tab键不能自动补全命令的参数
09-15
在Ubuntu操作系统中，Tab键是一个非常实用的功能，它允许用户在命令行中自动补全命令、文件名或路径，极大地提高了工作效率。然而，有时你可能会遇到Tab键无法自动补全命令参数的情况，这可能是由于系统配置的问题...
[QT]实现Tab键切换控件的两种方式及禁止Tab切换的简单方法
06-14
在QT编程中，用户界面（UI）的交互性是至关重要的，Tab键的使用就是提升用户体验的一个关键元素。Tab键可以方便用户在不同控件之间快速切换，无需使用鼠标。本篇文章将深入探讨如何实现Tab键切换控件的两种方式以及...
tab键在python中的作用_python中tab键是什么意思
weixin_39780784的博客
12-22 3331
python中tab键是什么意思,空格,代码,按下,尺寸,编辑器python中tab键是什么意思易采站长站，站长之家为您整理了python中tab键是什么意思的相关内容。对于程序员来说，其实Tab和空格远远不只是“立场”问题那么简单。在不同的编辑器里tab的长度可能不一致，所以在一个编辑器里用tab设置缩进后，在其它编辑器里看可能缩进就乱了。空格不会出现这个问题，因为空格就占一个字符的位置。众所周...
【SCI2区】基于遗传算法GA优化Transformer-BiLSTM锂电池健康寿命预测算法研究Matlab实现.rar
最新发布
10-08
1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 替换数据可以直接使用，注释清楚，适合新手
光伏储能vsg同步发电机三相并网simulink模型 含有无功指令+逆变器控制 出光伏储能VSG仿真simulink模型 光伏
10-08
光伏储能vsg同步发电机三相并网simulink模型 含有无功指令+逆变器控制 出光伏储能VSG仿真simulink模型 光伏储能联合并网 mppt扰动观察法追踪 功率指令可调，有功无功设置 vsg控制策略 同步发电机 可进行一次调频 储能进行直流侧电容稳压 simulink版本可调
基于plc的 液体饲料调配到自动饲喂组态设计程序自动控制自动配料 带解释的梯形图程序，接线图原理图图纸，io分配，组态画面
10-08
基于plc的 液体饲料调配到自动饲喂组态设计程序自动控制自动配料 带解释的梯形图程序，接线图原理图图纸，io分配，组态画面
JavaScript代码实现回车键替换为Tab键功能
"敲回车换Tab键2012" 在网页开发中，键盘事件的处理是提升用户体验的重要环节。这个资源主要关注的是如何通过JavaScript实现一个功能：当用户按下回车键时，如果当前焦点不在按钮、提交、重置、文本区域或任何其他...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值