页面HTML如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>JQuery_Study_Tab</title>
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/tab.js"></script>
<link rel="stylesheet" type="text/css" href="css/tab.css">
</head>
<body>
<ul id="tabfirst">
<li class="tabin">标签一</li>
<li>标签二</li>
<li>标签三</li>
</ul>
<div class="contentfirst contentin">内容1</div>
<div class="contentfirst">内容2</div>
<div class="contentfirst">内容3</div>
<br/>
<br/>
<br/>
<ul id="tabsecond">
<li class="tabin">装入完整页面</li>
<li>装入部分页面</li>
<li>从远程获取数据</li>
</ul>
<div id="contentsecond">
<img src="images/img-loading.gif" alt="数据加载中！">
<div id="realContent"></div>
</div>
</body>
</html>
css样式如下：
ul,li {
list-style: none;
text-align: center;
font-size: 12px;
}
ul {
padding: 10px;
margin: 0px;
}
#tabfirst li {
float:left;
background-color:#868686;
color:white;
padding:5px;
margin-right:2px;
border: 1px solid white;
}
#tabfirst li.tabin {
background-color:#6E6E6E;
border: 1px solid #6E6E6E;
}
div.contentfirst {
/**
* clear：该属性的值指出了不允许有浮动对象的边
* none：允许两边都可以有浮动对象 both：不允许有浮动对象
* left：不允许左边有浮动对象 right：不允许右边有浮动对象
**/
clear:left;
background-color:#6E6E6E;
color:white;
width:400px;
height:100px;
padding:10px;
display:none;
}
div.contentin {
/**
* display block：CSS1块对象的默认值。用该值为对象之后添加新行
**/
display:block;
}
#tabsecond li {
float:left;
background-color: white;
color:blue;
padding:5px;
margin-right:2px;
/**
* cursor：设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。
**/
cursor: pointer;
}
#tabsecond li.tabin {
background-color: #F2F6FB;
border: 1px solid black;
border-bottom: 0;
/**
* z-index：检索或设置对象的层叠顺序。
**/
z-index:100;
/**
* position：检索对象的定位方式。
* static：无特殊定位，对象遵循HTML定位规则
* absolute：将对象从文档流中拖出，使用left，right，top，bottom等属性进行绝对定位。而其层叠通过z-index属性定义。此时对象不具有边距，但仍有补白和边框
* relative：对象不可层叠，但将依据left，right，top，bottom等属性在正常文档流中偏移位置
* fixed：IE5.5及NS6尚不支持此属性
**/
position:relative;
}
#contentsecond {
width: 500px;
height: 140px;
padding: 10px;
background-color: #F2F6FB;
clear:left;
border: 1px solid black;
position:relative;
top:-1px;
}
img {
display: none;
}
js代码：
$(document).ready(function(){
/*
//找到所有的标签
$("li").mouseover(function(){
$("div.contentin").hide();
}).mouseout(function(){
});
*/
$("#tabfirst li").each(function(index){//i表示当前所选中的标签
$(this).mouseover(function(){
var liNode = $(this);
//延迟处理 防止用户恶意划动
timeoutid = setTimeout(function(){
$("div.contentin").removeClass("contentin");
$("div.contentfirst").eq(index).addClass("contentin");
$("#tabfirst li.tabin").removeClass("tabin");
liNode.addClass("tabin");
},300);
}).mouseout(function(){
clearTimeout(timeoutid);
});
});
//load()方法：载入远程 HTML 文件代码并插入至 DOM 中
$("#realContent").load("tabLoad.html");
$("#tabsecond li").each(function(index){
$(this).click(function(){
$("#tabsecond li.tabin").removeClass("tabin");
$(this).addClass("tabin");
if(index==0){
$("#realContent").load("tabLoad.html");
}else if(index==1){
$("#realContent").load("tabLoad.jsp h2");
}else if(index==2){
$("#realContent").load("tabData.jsp");
}
});
});
//对于所有Ajax请求开始执行的方法
$("#contentsecond img").bind("ajaxStart",function(){
$(this).show();
$("#realContent").html("");
//Ajax请求结束执行的方法
}).bind("ajaxStop",function(){
$(this).hide();
});
});
其中load方法加载的页面如下：
<html>
<head>
<title>动态加载数据</title>
</head>
<body>
<h2 align="center">Hello Word</h2>
</body>
</html>
<html>
<head>
<title>tabLoad.html</title>
</head>
<body>
This is my HTML page. <br>
</body>
</html>
<html>
<head>
<title>远程输出数据</title>
</head>
<body>
<div>
<%
out.println("远程输出数据！");
%>
</div>
</body>
</html>
分享到：
相关推荐
金煤婚恋 92版本， 去授权，仅供学习，商业使用请支持正版
传统办法管理信息首先需要花费的时间比较多，其次数据出错率比较高，而且对错误的数据进行更改也比较困难，最后，检索数据费事费力。因此，在计算机上安装小区团购管理软件来发挥其高效地信息处理的作用，可以规范信息管理流程，让管理工作可以系统化和程序化，同时，小区团购管理的有效运用可以帮助管理人员准确快速地处理信息。 小区团购管理在对开发工具的选择上也很慎重，为了便于开发实现，选择的开发工具为Eclipse，选择的数据库工具为Mysql。以此搭建开发环境实现小区团购管理的功能。其中管理员管理用户，新闻公告。 小区团购管理是一款运用软件开发技术设计实现的应用系统，在信息处理上可以达到快速的目的，不管是针对数据添加，数据维护和统计，以及数据查询等处理要求，小区团购管理都可以轻松应对。 关键词：小区团购管理；SSM框架，系统分析，数据库设计
数据集是一个关于初创企业失败案例的详细数据集，由Daglox Kankwanda于2025年2月27日发布在Kaggle上。该数据集包含483家初创企业的失败信息，数据来源于CB Insights的“初创企业失败后分析”汇编。 数据集涵盖了多个行业的初创企业，提供了丰富的字段信息，包括公司名称、行业领域、失败原因、资金筹集情况、运营时长、地理位置等。这些字段为研究者提供了多维度的视角，可以深入分析初创企业失败的共性和差异。 通过该数据集，研究者可以探索不同行业初创企业的失败模式，例如，某些行业可能因市场竞争激烈而失败，而另一些行业可能因技术瓶颈或资金不足而终止。此外，数据集还提供了失败原因的详细分类，如产品市场契合度不足、团队问题、资金链断裂等，为创业者和投资者提供了宝贵的经验教训。 该数据集不仅适用于商业分析和研究，还可以用于机器学习模型的训练，例如预测初创企业的成功概率或识别潜在的失败风险因素。对于希望深入了解创业生态和风险的研究者、创业者以及投资者来说，“Startup Failures”数据集是一个极具价值的资源。
Swift-Button封装
内容概要：本文档详尽介绍了AUTOSAR TcpIp模块的功能与设计，作为AUTOSAR通信栈的核心部分，它提供了完整的TCP/IP协议栈解决方案，包括TCP和UDP在内的多种协议以及IPv4和IPv6的支持。文档涵盖模块的总体架构设计，详细描绘其状态管理和数据传输机制，并阐述与其它相关模块之间的交互协作。同时，对初始化流程、Socket操作以及数据发送接收的具体过程进行了逐步拆解与解释。还介绍了针对可能出现故障时的错误处理措施。 适合人群：汽车电子工程师、嵌入式系统开发者、研究AUTOSAR规范及其网络协议栈实现的专业人士。 使用场景及目标：本文件主要用于深入了解和支持汽车行业内基于AUTOSAR平台的网络协议部署情况；为设计符合工业标准的车载信息系统打下坚实的基础；对于提升产品性能和安全性具有重要的指导价值。 其他说明：作者提供了一个详细的参考资料链接，感兴趣的读者可以进一步访问获取更多信息。此外，在实际工作中遇到的问题也可以参考文中所提到的各种处理方法来进行有效的排查和解决。
Thinkpad T480s的BIOS升级软件 【版本n22uj39w】
特易通国产对讲机TYT-T3 v1.0中英写频软件
Swift-ViewController+SP
Swift-PDFImage
VMware-Workstation-Full-17.6.2-24409262.x86_64.rar Linux版本 Vmware是一款领先的虚拟化软件，为用户提供强大的虚拟机平台。通过使用Vmware，用户可以在一台物理计算机上同时运行多个虚拟操作系统，实现资源的高效利用和隔离。它提供了灵活的配置选项、快速的性能和可靠的安全性，适用于个人用户、企业和数据中心。无论是开发测试、应用部署还是服务器管理，Vmware都是一个强大而可靠的工具，为用户提供了简单且可扩展的虚拟化解决方案。
内容概要：本文首先介绍了智能座舱的概念及其组成结构，详细解释了硬件、软件及交互三个部分的功能，并阐述了智能座舱从电子座舱到智能移动空间的不同发展阶段，重点讨论了语音交互和AR-HUD两大核心技术的发展路径及未来发展方向。接下来介绍车载基础软件的重要性及其分类，强调其在智能汽车发展中扮演的角色。文中指出，在软件定义汽车的趋势下，车载基础软件成为衔接硬件和应用软件的核心枢纽，特别是在软硬件分层解耦背景下，其作用日益凸显。最后探讨了当前国内车载基础软件行业的竞争情况与发展趋势。文章还分析了行业发展面临的高技术壁垒、高转换成本和高退出壁垒等问题，指出了车载基础软件对未来汽车产业变革的意义。 适用人群：从事汽车电子产品设计的研发人员、相关专业在校学生以及对汽车行业新技术感兴趣的爱好者。 使用场景及目标：该文档适合用作学习资料或研究参考资料，旨在帮助读者深入了解智能座舱的构成要素和技术演进，掌握车载基础软件的架构特点，洞悉该领域的市场动向。 其他说明：文中部分内容带有作者个人感悟和思考，但这并不影响其专业价值，反而增加了人文气息，有助于激发工程师的人文关怀和社会责任感。
JAVA面试最新最有效的全网顶级资料，免费提供，码字不易，你的关注就是博主最大的动力。
Swift-String-Extension
社会发展日新月异，用计算机应用实现数据管理功能已经算是很完善的了，但是随着移动互联网的到来，处理信息不再受制于地理位置的限制，处理信息及时高效，备受人们的喜爱。本次开发一套物流管理系统有管理员和用户两个角色。管理员功能有个人中心，用户管理，车辆信息管理，公告信息管理，司机管理，物流信息管理，运单信息管理，车辆类型管理，车辆状态管理，公告类型管理，物流状态管理，运单状态管理。用户可以注册登录，查看公告信息，查看物流信息，可以添加运单信息。物流管理系统服务端用Java开发，用Spring Boot框架开发的网站后台，数据库用到了MySQL数据库作为数据的存储。这样就让用户用着方便快捷，都通过同一个后台进行业务处理，而后台又可以根据并发量做好部署，用硬件和软件进行协作，满足于数据的交互式处理，让用户的数据存储更安全，得到数据更方便。 关键字：物流管理系统；Spring Boot框架；Java；MySQL
数据结构学习
KaihongOS_System_Component 4.1.2.17(RT00E000C000M68A).part2.rar 请勿下载，请联系对应销售获取。
数据结构学习
最长上升子序列（Longest Increasing Subsequence，LIS）问题是指在一个给定的无序序列中，找到一个最长的单调递增子序列的长度。
数据结构学习