在母版页上,我将此代码放在同一母版页中加载页面,然后运行jQuery函数
这是我的母版页标记:
<%@ Master Language="VB" CodeFile="MasterPage.master.vb" Inherits="MasterPage" %>
<!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 runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#mainContactLink").click(function() {
$(body).open("about-us.aspx", self);
$("#mainContTable #abtContacts").fadeIn(1000).siblings("div").fadeOut(100);
$("#mainContTable #abtContacts").siblings();
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="mainContainer">
<div id="subContainer">
<div id="topNavigation">
<ul id="topNav">
<li><a href="Default.aspx">Home</a>
</li>
<li><a href="awards.aspx">Awards</a></li>
<li><a href="projects.aspx">Projects</a>
</li>
<li><a href="NewsDetails.aspx">News</a></li>
<li><a href="profile.aspx">Profile</a></li>
<li><a href="about-us.aspx">About Us</a></li>
</ul>
</div>
<div id="logoDiv">
<img alt="logo" src="images/logo.png" />
</div>
<div id="mainContent" >
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="footer">
<a href="careers.aspx">Careers</a> | <a href="companies.aspx">Companies</a> | <a href="pre-qualification.aspx">Pre-qualification</a> | <a href="about-us.aspx#abtContacts" id="mainContactLink">contact Us</a><div id="content"></div>
</div>
</div>
</div>
</form>
</body>
</html>
这是关于-us.aspx
<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="about-us.aspx.vb" Inherits="about_us" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"></asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<div id="contMainDiv">
<img alt="About Us" src="images/headers/about-header.png" />
<table id="mainContTable">
<tr >
<td class="leftTd">
<div id="contentBodyDiv" class="flexcroll">
<div id="abtIntro" style="display:block;">this is some about intro</div>
<div id="abtHistory" style="">this is some about History</div>
<div id="abtContacts" style="display:block;">and these are contact details</div>
</div>
</td>
<td class="rightTd">
<div id="rightmenu">
<ul class="rightmenu">
<li><a href="#" id="introLink">Introduction</a></li>
<li><a href="#" id="historyLink">History</a></li>
<li><a href="#" id="visionLink">Vision and Mission</a></li>
<li><a href="#" id="contatUsLink">Contact Us</a></li>
</ul>
</div>
</td>
</tr>
</table>
</div>
</asp:Content>
它不起作用..任何想法?
答案 0 :(得分:5)
如果您的意思是在同一页面内加载,则可以使用JQuery的load
方法。
$(document).ready(function() {
$("#mainContactLink").click(function() {
$('body').load("about-us.aspx");
$(" #abtContacts").fadeIn(1000).siblings("div").fadeOut(100);
});
});