如何在asp.net中将javascript文件和css添加到母版页的contentpage中_Javascript_Css_Asp.net

如何在asp.net中将javascript文件和css添加到母版页的contentpage中

javascript css asp.net

如何在asp.net中将javascript文件和css添加到母版页的contentpage中,javascript,css,asp.net,Javascript,Css,Asp.net,如何将javascript文件和css添加到asp.net母版页的contentpage中。我试图在我的内容页中包含一个日期时间选择器。但它在母版上工作得很好。当我试着在我的内容页面中放同样的内容时，它不起作用 this is Content Page code: <%@ Page Title="" Language="C#" MasterPageFile="~/testmasterpage.master" AutoEventWireup="true" CodeFile="datet

如何将javascript文件和css添加到asp.net母版页的contentpage中。我试图在我的内容页中包含一个日期时间选择器。但它在母版上工作得很好。当我试着在我的内容页面中放同样的内容时，它不起作用

this is Content Page code:



<%@ Page Title="" Language="C#" MasterPageFile="~/testmasterpage.master" AutoEventWireup="true" CodeFile="datetime.aspx.cs" Inherits="datetime" %>

<asp:Content ID="Content1" ContentPlaceHolderID="Head" Runat="Server">


    <link href="css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/jquery-ui-1.8.19.custom.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#txtDate").datepicker();
        });
</script>

<style type="text/css">
.ui-datepicker { font-size:8pt !important}
</style>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
</asp:Content>




 this is masterpage code:

<head runat="server">
 <title></title>



    <asp:ContentPlaceHolder ID="Head" runat="server">

    </asp:ContentPlaceHolder>




</head>
<body>
 <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

                                    </asp:ContentPlaceHolder>
`</body>`
</html>

这是内容页代码：
$（函数（）{
$（“#txtDate”）.datepicker（）；
});
.ui日期选择器{字体大小：8pt！重要}
这是母版页代码：
``
和标签应放入标签。
和标签应放入标签。
我们不能使用
标签在内容页中，我们将其放置在母版页中，您已经将链接和脚本标签放置在正确的位置，请尝试javascript函数调用
$("ctl00_ContentPlaceHolder1_txtDate").datepicker();

并将警报和调试器放在datepicker函数和下面一行的上方
$("ctl00_ContentPlaceHolder1_txtDate").datepicker();

并检查它，如果仍然不起作用，则可能是您的JQuery调用有问题。
我们无法使用
标签在内容页中，我们将其放置在母版页中，您已经将链接和脚本标签放置在正确的位置，请尝试javascript函数调用
$("ctl00_ContentPlaceHolder1_txtDate").datepicker();

并将警报和调试器放在datepicker函数和下面一行的上方
$("ctl00_ContentPlaceHolder1_txtDate").datepicker();

并检查它，如果它仍然不工作，则可能是JQuery调用有问题。
是否对这些文件路径使用了“~”字符？通常，asp页面会认为每个页面使用不同的路径。因此，我们需要为每个加载的css/js文件定义相对路径
因此，请尝试以下方法来更正您的页面：
<asp:Content ID="Content1" ContentPlaceHolderID="Head" Runat="Server">


    <link href="~/css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="stylesheet" type="text/css" />
    <script src="<%: ResolveUrl("~/js/jquery-1.7.2.min.js") %>" type="text/javascript"></script>
    <script src="<%: ResolveUrl("~/js/jquery-ui-1.8.19.custom.min.js") %>"  type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#txtDate").datepicker();
        });
</script>

<style type="text/css">
.ui-datepicker { font-size:8pt !important}
</style>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
</asp:Content>




 this is masterpage code:

<head runat="server">
 <title></title>



    <asp:ContentPlaceHolder ID="Head" runat="server">

    </asp:ContentPlaceHolder>




</head>
<body>
 <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

                                    </asp:ContentPlaceHolder>
</body>
</html>


$（函数（）{
$（“#txtDate”）.datepicker（）；
});
.ui日期选择器{字体大小：8pt！重要}
这是母版页代码：

也许您需要使用页面名称空间“Page.ResolveUrl”调用ResolveUrl。
您是否对这些文件路径使用了“~”字符？通常，asp页面会认为每个页面使用不同的路径。因此，我们需要为每个加载的css/js文件定义相对路径
因此，请尝试以下方法来更正您的页面：
<asp:Content ID="Content1" ContentPlaceHolderID="Head" Runat="Server">


    <link href="~/css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="stylesheet" type="text/css" />
    <script src="<%: ResolveUrl("~/js/jquery-1.7.2.min.js") %>" type="text/javascript"></script>
    <script src="<%: ResolveUrl("~/js/jquery-ui-1.8.19.custom.min.js") %>"  type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#txtDate").datepicker();
        });
</script>

<style type="text/css">
.ui-datepicker { font-size:8pt !important}
</style>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <asp:TextBox ID="txtDate" runat="server"></asp:TextBox>
</asp:Content>




 this is masterpage code:

<head runat="server">
 <title></title>



    <asp:ContentPlaceHolder ID="Head" runat="server">

    </asp:ContentPlaceHolder>




</head>
<body>
 <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

                                    </asp:ContentPlaceHolder>
</body>
</html>


$（函数（）{
$（“#txtDate”）.datepicker（）；
});
.ui日期选择器{字体大小：8pt！重要}
这是母版页代码：

也许您需要使用页面名称空间“Page.ResolveUrl”调用ResolveUrl。
您必须执行的操作：
我相信您希望在“母版页”中包含所有脚本
每个ContentPage
都有一个MasterPage
，MasterPage是“父”，因此他包含的每个脚本或样式也将存在于他的ContentPage
中
如果有意义，请转移：
    <link href="css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/jquery-ui-1.8.19.custom.min.js" type="text/javascript"></script>



转到母版页，在标签下
通过[chrome developer tools][1]查看控制台选项卡中的错误，您可能会遇到一些错误，说他找不到jquery或datepicker`，
您应该选择这些脚本的路径（可能）：
将成为：

你可以参考这篇文章了解你要做的事情：
我相信您希望在“母版页”中包含所有脚本
每个ContentPage
都有一个MasterPage
，MasterPage是“父”，因此他包含的每个脚本或样式也将存在于他的ContentPage
中
如果有意义，请转移：
    <link href="css/ui-lightness/jquery-ui-1.8.19.custom.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/jquery-ui-1.8.19.custom.min.js" type="text/javascript"></script>



转到母版页，在标签下
通过[chrome developer tools][1]查看控制台选项卡中的错误，您可能会遇到一些错误，说他找不到jquery或datepicker`，
您应该选择这些脚本的路径（可能）：
将成为：

你可以参考这篇文章，有时候用框架提供的工具做这件事更容易。在本例中，在代码隐藏中调用ClientScriptManager.RegisterStartupScript（）会将脚本插入正确的位置：页面内容之后，body标记之前。只有在（重新）加载整个页面时才会添加脚本
此代码将进入页面加载。无需检查iPostBack
C版本：
String sKey=“SomeUniqueKeyForThisScript”；
类型tType=Page.GetType；
ClientScriptManager csm=Page.ClientScript；
csm.RegisterStartupScript（tType，sKey，“”）

VB版本：
Dim sKey As String = "SomeUniqueKeyForThisScript"
Dim tType As Type = Page.GetType
Dim csm As ClientScriptManager = Page.ClientScript
csm.RegisterStartupScript(tType, sKey, "<script src=""" & ResolveUrl("~/Scripts/my-custom-script.js") & """></script>")

Dim sKey As String=“SomeUniqueKeyForThisScript”
Dim tType As Type=Page.GetType
Dim csm As ClientScriptManager=Page.ClientScript
csm.RegisterStartupScript（tType，sKey，“”）

如果异步回发中包含受影响的控件，则显然需要重新绑定任何JS事件。通过使用ScriptManager.RegisterStartupScript（）并将重新加载的控件作为第一个参数传递，可以很容易地做到这一点，这样只有在重新加载控件时才能执行脚本。
有时候，使用框架提供的工具来完成这一任务更容易。在本例中，在代码隐藏中调用ClientScriptManager.RegisterStartupScript（）会将脚本插入正确的位置：页面内容之后，body标记之前。只有在（重新）加载整个页面时才会添加脚本
此代码将进入页面加载。无需检查iPostBack
C版本：
String sKey=“SomeUniqueKeyForThisScript”；
类型tType=Page.GetType；
ClientScriptManager csm=Page.ClientScript；
csm.RegisterStartupScript（tType，sKey，“”）

VB版本：
Dim sKey As String = "SomeUniqueKeyForThisScript"
Dim tType As Type = Page.GetType
Dim csm As ClientScriptManager = Page.ClientScript
csm.RegisterStartupScript(tType, sKey, "<script src=""" & ResolveUrl("~/Scripts/my-custom-script.js") & """></script>")

Dim sKey As String=“SomeUniqueKeyForThisScript”
Dim tType As Type=Page.GetType
Dim csm As ClientScriptManager=Page.ClientScript
csm.RegisterStartupScript（tTy