Fatal编程技术网
  • javascript/
  • Javascript 内容页中的JQuery未执行

Javascript 内容页中的JQuery未执行

javascript jquery asp.net

Javascript 内容页中的JQuery未执行,javascript,jquery,asp.net,master-pages,Javascript,Jquery,Asp.net,Master Pages,我一直试图让jquery datepicker插件在内容页面上工作，但根本无法让页面执行任何jquery。我设法让日期选择器在我的母版页上工作，但没有在内容页上工作。firefox的firebug工具也没有发现任何javascript错误。如果有人能在我的内容页面上使用日期选择器，那就太好了。提前谢谢 .ASPX： <asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">

我一直试图让jquery datepicker插件在内容页面上工作，但根本无法让页面执行任何jquery。我设法让日期选择器在我的母版页上工作，但没有在内容页上工作。firefox的firebug工具也没有发现任何javascript错误。如果有人能在我的内容页面上使用日期选择器，那就太好了。提前谢谢

.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>


$（文档）.ready（函数（）{
$（“#TextBoxConnectedOn”）.datepicker（）；
});
母版页标题：

<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>
编辑
我将“#TextBoxConnectedOn”改为“#”，现在firebug显示，一旦我点击输入，它就会加载所需的图片，但仍然不显示日期选择器。我的问题主题和挫折感的主要来源是jquery没有执行，所以我想这篇文章已经回答了，感谢所有的信息，我看看我是否能找出为什么它没有显示为服务器生成的控件，输入框的
id
实际上不会连接到
文本框上
；ASP.NET将为您生成一个
id
。在浏览器中查看页面源以验证这一点

你有两个选择：


  • 从控件中删除
    runat=“server”
    属性，使其成为常规HTML元素（它真的需要由服务器生成吗？），或者
    • 

  • 参考正确的
    id
    • 
像这样：
    

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

    

    
$（文档）.ready（函数（）{
$（“#”）日期选择器（）；
});

    

    
编辑
    

    根据@jbn下面的评论，从ASP.NET 4开始，您可以告诉服务器控件使用静态ID，方法是将其
    ClientIDMode
    设置为
    static
    我以前也遇到过类似的问题，jQuery被加载到母版页，然后加载到内容页，这导致内容页上的jQuery无法工作，因此，请检查firebug中的.net选项卡，并确保jQuery只加载一次
    
希望这有帮助
    

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

    

    

    这通常是由于路由的工作方式导致js文件未加载的结果。尝试使用如上所示的Url.Content（）方法。
    这是因为内容页更改了
    input type=“text”
    的id
    
有两种方法可以克服这个问题
    
（a） 为输入类型指定一个类，并使用该类调用它
    

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

    
（b） 将HTMLControl设置为ASP.NET控件，并设置
    clientMode=“static”
    

    

    

    这样就无需更改脚本。
    是否加载了所有JavaScript？你可以查看firebug的“网络”选项卡。你确定你没有那个TextBoxConnectedOn的双重ID吗？@marto所有这些都在加载，谢谢你的提示，我不知道firebug可以告诉我。内容是在母版页之后动态加载的吗？i、 e.如果母版页加载并运行
    $（“#TextBoxConnectedOn”）.datepicker（）
    ，是否已加载带有
    id=“TextBoxConnectedOn”
    的文本框？为此，需要使用CliendID控件属性：
    $（document）.ready（函数（）{$（''）.datepicker（）；}）谢谢你的回答。我会用谷歌搜索一下，看看我是否能得到正确的id。对不起，那是在那里，但markdown搞乱了我的格式：）好的，我再次检查了firebug，尽管它没有显示，但我现在单击输入后，它正在加载所需的图片。另外，在asp.net 4中，你可以将id设置为静态，因此，在javascript中，相同的id（没有任何前缀）是可用的。Firebug显示所有id都正在加载感谢回答它在Firebug中只显示了一次，所以我认为它只加载了一次，感谢回答

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

    

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