2010-04-04 51 views
0

在母版页,我把这个代码在同一个母版页加载页面,然后运行jQuery函数如何加载一个页面,然后运行一个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

@Khawar - 根据您更新的问题...我不知道您要做什么。点击这个时,你是否已经在'about-us.aspx'页面中,它是否在同一个主页中? – 2010-04-07 11:43:44

回答

5

如果你的意思是在同一页面内加载,你可以使用JQuery的load方法。

$(document).ready(function() { 
    $("#mainContactLink").click(function() { 
    $('body').load("about-us.aspx"); 
     $(" #abtContacts").fadeIn(1000).siblings("div").fadeOut(100); 
    }); 
}); 
+0

我的意思不是完全相同的页面其.aspx页面加载在母版页,我在母版页上写这个代码 – Khawar 2010-04-06 12:44:23

+0

@Khawar:你应该能够根据你的需要修改代码。请参阅jquery站点上的load方法的文档。谢谢 – Sarfraz 2010-04-07 12:14:20