Question

我已经做了这个例子，它在普通的aspx网页上运行良好。我使用Visual Studio 2010.

头部分：

<title>Show/hide element</title>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
    $(document).ready(function () {

        $('#CheckBoxShowHide').click(function () {
            $("#ShowHideElement").slideToggle();
        });
    });
</script>

<style type="text/css">
    #ShowHideElement
    {
        width:400px;
        height:100px;
        background-color:Aqua;
    }
</style>

身体部位：

<form id="form1" runat="server">

    <asp:CheckBox ID="CheckBoxShowHide" runat="server" Text="Show/hide" />
    <div id="ShowHideElement">
        This is the element for show/hide
    </div>

</form>

当我有一个母版页和子网页上相同的代码时，JQuery就可以了。加载JQuery javascript文件失败。子页面和母版页位于同一文件夹中。如果我把代码放在母版页上它工作正常，但我也想在子页面上使用JQuery。请帮帮我。

Answer 1

我也可以看到另一个问题，你试图根据其服务器ID而不是ClientID来获取复选框ID。一旦将asp控件呈现到客户端上，其ID就会被更改。请尝试以下代码：

<title>Show/hide element</title>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
    $(document).ready(function () {

        $('#<%=CheckBoxShowHide.ClientID%>').click(function () {
            $("#ShowHideElement").slideToggle();
        });
    });
</script>

<style type="text/css">
    #ShowHideElement
    {
        width:400px;
        height:100px;
        background-color:Aqua;
    }
</style>

身体部位：

<form id="form1" runat="server">

    <asp:CheckBox ID="CheckBoxShowHide" runat="server" Text="Show/hide" />
    <div id="ShowHideElement">
        This is the element for show/hide
    </div>

</form>

以下一行是我改变的唯一内容：

$('#<%=CheckBoxShowHide.ClientID%>').click(function () {

希望它有所帮助。

Answer 2

如果jQuery位于您的母版页上，它将在您的子页面上运行。

主人`<head>`

<head>
     <script type="text/javascript" src="js/jquery.js"></script>
</head>

儿童`<head>`

<head>
    <script type="text/javascript">
        $(document).ready(function () {
             //Do Child jQuery Stuff here....
        });
    </script>
<head>

如果您遇到问题，唯一需要检查的是确保您的jquery文件路径正确。（也许它应该是../js/jquery.js）

如果我建议的其他内容不起作用，请使用此选项以确保不是问题：

对于您的母版页<head>：

<head>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>

或（如果你想托管它）

<head>
     <script type="text/javascript" src='<%=ResolveURL("~/js/jquery.js")%>'></script>
</head>

在哪里〜/是你的根。

Answer 3

您确定您的页面正在加载jQuery，在您的母版页中使用绝对URL来引用jQuery库。

Answer 4

您应该只能将链接放在母版页的HEAD部分中的JQuery库中。当页面运行时，它将生成主页面的HTML内容以及HEAD部分中的链接，内容页面应该能够使用户成为JQuery库的用户。我知道我们在链接如何完成方面遇到了问题。也许尝试在这样的主页的HEAD中链接：

<script type="text/javascript" src='<% = ResolveURL("~/js/jquery.js") %>' ></script>

＆＃39;＆lt; %%＆gt;＆＃39;是一种在页面加载时执行内联服务器端代码的方法，因此页面将根据URL的位置注入正确的src。

JQuery在使用母版页的aspx页面中不起作用

4 个答案:

如果jQuery位于您的母版页上，它将在您的子页面上运行。

主人`<head>`

儿童`<head>`

JQuery在使用母版页的aspx页面中不起作用

4 个答案:

如果jQuery位于您的母版页上，它将在您的子页面上运行。

主人<head>

儿童<head>

主人`<head>`

儿童`<head>`