簡體   English   中英

Asp.net母版頁和ContentPage JavaScript函數錯誤

[英]Asp.net Masterpage and ContentPage JavaScript Function error

我正在為我的upload_photo.aspx使用母版頁,該母版頁使用colorBox顯示文件上傳頁面。 但是,自從我在Masterpage colorBox中添加(下面的代碼)以來,就不會顯示:

<script type="text/javascript">
            $(function () {
                $("#txtAutoCompleteSearch").AutoComplete("search.aspx?searchword=");
            });

            function clear_textbox() {
                if (document.aspnetForm.searchField.value == " Enter Your Search Here ")
                    document.aspnetForm.searchField.value = "";
            };

        </script>

以下是首頁代碼:

<%@ 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" />
    <link href="Css/menu_style.css" rel="stylesheet" type="text/css" />
     <link href="styles/css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />

    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">        google.load('jquery', '1.3.2');</script>
    <script src="styles/js/jquery.autocomplete.js" type="text/javascript"></script>
    <script src="styles/js/jquery.dimensions.js" type="text/javascript"></script>
    <script src="styles/js/jquery.highlight-3.yui.js" type="text/javascript"></script>


    <script type="text/javascript">
        $(function () {
            $("#txtAutoCompleteSearch").AutoComplete("search.aspx?searchword=");
        });

        function clear_textbox() {
            if (document.aspnetForm.searchField.value == " Enter Your Search Here ")
                document.aspnetForm.searchField.value = "";
        };

    </script>

</head>
<body>
    <form id="masterPageForm" runat="server">

    <div id="pagewidth">
        <div id="Header">
            <asp:Label ID="userName" runat="server" Text="" style=" color: Maroon; font-size: large; z-index: 103; left: 805px; position: absolute; top: 132px"></asp:Label>
             <asp:LoginStatus ID="LoginStatus1" runat="server" ForeColor="White" 
                LogoutPageUrl="~/Default.aspx" LogoutText="Logout" CssClass="logOut" 
                BackColor="#454545" Font-Bold="True" Font-Names="Arial Black" 
                Font-Size="Small" />

            <%--<asp:Image ID="logoHeader" runat="server" CssClass="rounded-corners" ImageUrl="~/img/logo.png"/>--%>
            <asp:HyperLink ID="hlLogo" runat="server" ImageUrl="~/img/logo.png" NavigateUrl="~/home.aspx"></asp:HyperLink>

            <%--style="width: 1000px; height: 120px; margin-top: 10px;" />--%>
            <div style="top: 61px; left: 476px; position: absolute; height: 37px; width: 526px; font-size: medium; font-style: italic; color: #CCFF99; font-weight: bolder; z-index: 103;">
                <input id="txtAutoCompleteSearch" name="searchField" class="tb11" type="text" onfocus="clear_textbox()" value=" Enter Your Search Here "/> 
            <asp:ContentPlaceHolder id="Heading" runat="server">

            </asp:ContentPlaceHolder>

            </div>

        <div class="background">
   <asp:menu id="NavigationMenu" CssClass="NavigationMenu"  
        staticdisplaylevels="2" DynamicHorizontalOffset="1"
        staticsubmenuindent="1px" MaximumDynamicDisplayLevels="4"
        orientation="Horizontal"   
        DynamicPopOutImageUrl="~/img/right-arrow.gif" 
        StaticPopOutImageUrl="~/img/drop-arrow.gif"
        datasourceid="MenuSource"    
        runat="server" Height="30px">

        <staticmenuitemstyle ItemSpacing="10" CssClass="staticMenuItemStyle"/>
        <statichoverstyle CssClass="staticHoverStyle" />
        <StaticSelectedStyle CssClass="staticMenuItemSelectedStyle"/> 
        <DynamicMenuItemStyle CssClass="dynamicMenuItemStyle" />      
        <dynamichoverstyle CssClass="menuItemMouseOver" />
        <DynamicMenuStyle CssClass="menuItem" />
        <DynamicSelectedStyle CssClass="menuItemSelected" />

        <DataBindings>        
             <asp:MenuItemBinding DataMember="siteMapNode" 
                NavigateUrlField="url" TextField="title"  
                    ToolTipField="description" />
        </DataBindings>

      </asp:menu>
    </div>

    <asp:TreeView ID="NavigationTreeView" runat="server" Visible="false" DataSourceID="MenuSource" />

<div id="e">
        <asp:SiteMapPath ID="SiteMapPath1" runat="server" 
                RenderCurrentNodeAsLink="true" 
                CssClass="currentNodeStyle"
            PathSeparator=" >> " Visible="False">
            <PathSeparatorStyle ForeColor="#5D7B9D" CssClass="currentNodeStyle" />
            <CurrentNodeStyle ForeColor="#333333" CssClass="currentNodeStyle" />
            <NodeStyle ForeColor="#7C6F57"  CssClass="currentNodeStyle"  />
            <RootNodeStyle  ForeColor="#5D7B9D" CssClass="currentNodeStyle"  />
    </asp:SiteMapPath> 
</div>    

    <asp:Panel ID="AccessKeyPanel" runat="server">
    </asp:Panel>
       <asp:SiteMapDataSource id="MenuSource" runat="server" StartFromCurrentNode="false" ShowStartingNode="true" />

       <div id="tabDiv">
             <asp:ContentPlaceHolder id="mainBody" runat="server">

             </asp:ContentPlaceHolder>   
        </div>

        <div id="footer">
            &copy; Copyright Family Photo Online System</div>
    </div>
    </div>
    </form>

<script type="text/javascript">

    function navigateTo(url) {
        window.location = url;
    }

</script>

</body>
</html>

以下是javascript的upload_photo.aspx代碼:

<script src="alerts/impromptu/jquery.js" type="text/javascript"></script>
    <script src="alerts/impromptu/jquery-impromptu.2.6.min.js" type="text/javascript"></script>
    <link href="alerts/impromptu/impromptu.css" rel="stylesheet" type="text/css" />

<link href="colorBox/colorbox.css" rel="stylesheet" type="text/css" />
    <script src="colorBox/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="colorBox/jquery.colorbox.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //Examples of how to assign the ColorBox event to elements
            $("a[rel='example1']").colorbox();
            $("a[rel='example2']").colorbox({ transition: "fade" });
            $("a[rel='example3']").colorbox({ transition: "none", width: "75%", height: "75%" });
            $("a[rel='example4']").colorbox({ slideshow: true });
            $(".example5").colorbox();
            $(".example6").colorbox({ iframe: true, innerWidth: 425, innerHeight: 344 });
            $(".example7").colorbox({ width: "47%", height: "100%", iframe: true });
            $(".example8").colorbox({ width: "50%", inline: true, href: "#inline_example1" });
            $(".example9").colorbox({
                onOpen: function () { alert('onOpen: colorbox is about to open'); },
                onLoad: function () { alert('onLoad: colorbox has started to load the targeted content'); },
                onComplete: function () { alert('onComplete: colorbox has displayed the loaded content'); },
                onCleanup: function () { alert('onCleanup: colorbox has begun the close process'); },
                onClosed: function () { alert('onClosed: colorbox has completely closed'); }
            });

            //Example of preserving a JavaScript event for inline calls.
            $("#click").click(function () {
                $('#click').css({ "background-color": "#f00", "color": "#fff", "cursor": "inherit" }).text("Open this window again and this message will still be here.");
                return false;
            });
        });
</script>

Firebug引發以下錯誤:

$(“ a [rel ='example1']”)。colorbox不是函數http:// localhost:3478 / upload_photo.aspx第19行

如果我從母版頁刪除Javascript函數,則colorBox jQuery可以正常工作。

誰能告訴我我要去哪里哪里以及如何糾正它? 任何幫助,將不勝感激。

謝謝

可能是因為您在母版頁和照片頁中都包含了jquery。 這將導致jQuery加載,初始化,在您的母版頁中運行腳本,然后將其全部丟棄並重新加載,並在上載到upload_photo.aspx中的jQuery腳本標簽時重新初始化所有內容。 您只希望每個javascript庫加載一次,否則會造成各種混亂。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM