js表格高亮显示.hover

JavaScript023

js表格高亮显示.hover,第1张

这是表格高亮显示功能。

hover一个模仿悬停事件。鼠标移动到一个对象上面及移出这个对象。的方法。这是一个自定义的方法,它为频繁使用的任务提供了一种保持在其中的状态。当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。而且,会伴随着对鼠标是否仍然处在特定元素中的检测,如果是,则会继续保持悬停状态,而不触发移出事件。

第一种各行换色,第二种鼠标移动到对应行,高亮显示。

1.在页面div中创建一个空白表,可以根据需要对其进行定制。

2.创建表之后,我们可以编写关键代码来动态生成表。我们编写了一个js方法来触发使用。

3.在<TB >标签中,我们添加了标签,主要用于提供用户输入参数,而全局变量num主要用于区分每个添加参数的唯一id。

4.获取表中的数据,以供下图参考。

5.一旦我们获得了表中的数据,我们就应该将其转换成json数据的形式。

1、进入Internet属性。

2、点击安全。

3、选择自定义级别。

4、把ActiveX控件和插件下的所有选项都改成启用。

5、服务器生成html格式的Excel,然后设置

后台管理的功能:

1、需要将excel表格中的数据一次性复制到html table中

2、点击提交按钮,将table中的数据提交到服务器端进行处理。

代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=GBK">

<script src="http://code.jquery.com/jquery-1.7.1.min.js" language="javascript"></script>

<style type="text/css">

body{

background-color: white

margin: 0

padding: 0

}

table {

width:95%

padding: 0

margin-left:30px

text-align: center

}

th {

font: 15px "trebuchet ms", '楷体_GB2312'

color: #4f6b72

border-right: 1px dashed #c1dad7

border-bottom: 1px dashed #c1dad7

border-top: 1px dashed #c1dad7

letter-spacing: 2px

text-transform: uppercase

background: #cae8ea

margin: 0

}

td {

border-right: 1px dashed #c1dad7

border-top: 1px dashed #c1dad7

border-bottom: 1px dashed #c1dad7

background: #fff

font-size:12px

color: #4f6b72

margin: 0

}

.btn_03{

background-attachment: scroll

background-clip: border-box

background-color:  #cae8ea

background-origin: padding-box

background-size: auto auto

width: 65px

}

.error{

width: 12%

vertical-align: top

}

input{

padding: 0

margin: 0

border: 0

background: white

width: 100%

height:100%

}

</style>

</head>

<br/>