<html>
<head>
<title>jquery table 选中效果</title>
<script type="text/javascript" src="http://www.srcfans.com/js/jquery-1.9.1.min.js"></script>
<style>
.tb{
cellspacing:0px;
border-spacing: 0px;
border:1px solid #000;
}
.tb td{
width:100px;
height:50px;
border:1px solid #000;
}
.td_bg{
background:#FFAA00;
}
</style>
<script>
var mouse_begin={x:0,y:0};
var mouse_end={x:0,y:0};
$(function(){
init();
$("body").mousedown(function(){
$(".tb td").removeClass('td_bg');//点击表格之外的部分,清空所有选中
})
})
function init(){
mouseDown();
mouseUp();
}
function mouseDown(){
$(".tb td").mousedown(function(e){
e.stopPropagation();//
jquery table 鼠标选中单元格效果
最新推荐文章于 2021-06-25 20:22:26 发布
本文介绍如何使用jQuery实现表格(table)中鼠标点击选中单元格的效果,探讨相关事件处理和CSS样式设置,帮助提升网页交互体验。
摘要由CSDN通过智能技术生成