JQuery在內容頁面不執行

我一直在試圖讓jquery datepicker插件在內容頁面上工作，但一直無法讓頁面執行任何jquery。我設法讓datepicker在我的主頁上工作，但不是內容頁面。此外，Firefox的螢火蟲工具沒有拿起任何JavaScript錯誤。如果任何人有一個解決方案，使日期選擇器在我的內容頁面上工作，那將很棒。提前致謝。JQuery在內容頁面不執行

.ASPX：

<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $("#TextBoxConnectedOn").datepicker(); 
    }); 
    </script> 
</asp:Content> 

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server"> 
    <input type="text" name="TextBoxConnectedOn" id="TextBoxConnectedOn" 
    runat="server" MaxLength="10"/> 
</asp:Content>

母版頭：

<head runat="server"> 
    <link type="text/css" href="pages/scripts/themes/ui-darkness/jquery.ui.all.css" 
    rel="stylesheet" /> 
    <script type="text/javascript" src="scripts/jquery-1.4.2.js"></script> 
    <script type="text/javascript" src="scripts/ui/jquery.ui.core.min.js"></script> 
    <script type="text/javascript" src="scripts/ui/jquery.ui.datepicker.min.js"></script> 
    <asp:ContentPlaceHolder ID="HeadContent" runat="server"> 
    </asp:ContentPlaceHolder> 
</head>

EDIT
我改變「#TextBoxConnectedOn」到「＃<％= TextBoxConnectedOn.ClientID％>」和現在螢火表明它加載所需的圖片，一旦我點擊輸入，但它仍然不顯示日期選擇器。我的問題主題和挫折的主要來源是jQuery不執行，所以我想這個帖子是回答，感謝所有的信息，我看看我是否能找出它爲什麼不顯示

來源

2011-07-25 Ferdie

是否正在加載所有JavaScript？你可以檢查螢火蟲'net'標籤。 – marto

你確定你沒有TextBoxConnectedOn的double ID嗎？ – Pehmolelu

@marto所有這些都被加載，謝謝你的提示，我不知道螢火蟲可以告訴我。 – Ferdie

作爲一個服務器生成的控制輸入框的id實際上不是TextBoxConnectedOn; ASP.NET將爲您生成一個id。在瀏覽器中查看頁面的來源，以驗證這一點。

你有兩個選擇：

從控制取出runat="server"屬性，使它成爲一個普通的HTML元素，或
參考（它確實需要服務器生成？）正確的id

像這樣：

<script type="text/javascript"> 
    $(document).ready(function() { 
    $("#<%= TextBoxConnectedOn.ClientID %>").datepicker(); 
    }); 
</script>

編輯

按@ JBN的下面的評論，因爲ASP.NET 4，你可以告訴服務器控件通過設置其ClientIDMode到Static使用靜態標識。

來源

2011-07-25 09:49:48

要做到這一點，您需要使用CliendID控件屬性： ' ' –

感謝您的答案如果我可以得到正確的身份證，那麼谷歌有點不好。 – Ferdie

@Alberto即將去google搜索，感謝您的回答 – Ferdie

我以前有過類似的問題，jQuery被加載到母版頁上，然後是內容頁面，這導致內容頁面上的jQuery無法工作，因此請檢查螢火蟲中的.net標籤並確保jQuery只被加載一次。

希望這有助於

來源

2011-07-25 09:49:52 BenW

它只顯示一次在螢火蟲，所以我認爲它只加載一次，謝謝你的答案 – Ferdie

<script type="text/javascript" src='<%=Url.Content("~/scripts/ui/jquery.ui.core.min.js")%>'></script>

這通常是JS的結果，因爲如何路由工作的文件不加載。嘗試使用上面顯示的Url.Content（）方法。

來源

2011-07-25 09:51:54

Firebug顯示所有人正在加載感謝您的答案 – Ferdie

那是因爲您的內容頁面更改了您的input type="text"的ID。

克服這個問題的兩種方法。（a）給一個類輸入類型並使用它來調用它。

<input type="text" name="TextBoxConnectedOn" id="TextBoxConnectedOn" 
    runat="server" MaxLength="10" class="mypicker/>

現在這樣稱呼它

$(document).ready(function() { 
    $(".mypicker").datepicker(); 
});

（b）作出的HTMLControl時ASP.NET控件，並設置ClientIDMode="static"

<asp:TextBox ID="TextBoxConnectedOn" runat="server" 
     ClientIDMode="Static" 
     Width="240"> 
</asp:TextBox>

那麼就沒有必要改變你的腳本。

來源

2011-07-25 10:05:41 naveen

ClientIDMode是好的，但只在ASP.NET 4.0中可用 –

感謝您的回答 – Ferdie

JQuery在內容頁面不執行

回答

相關問題