Question

我有一个名为AddNews.aspx的页面，在代码隐藏中有一个名为AddNews（Parameters）的Web方法。

AddNews.aspx页面继承自母版页。所以我使用了contentplaceholder。

我有一个按钮..它的id是btnSave。

这是jquery代码：

$(function() {
    $("[id$='_btnSave']").click(function() {
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            data: $.toJSON(veriler),
            url: "AddNews.aspx/AddNews",
            dataType: "json",
            success: function(result) {
                $("#result").html('News added');
            },
            error: function() {
                alert('Problem');
            }
        });
    });
});
</script>

按钮点击不要触发..我该怎么办？感谢。

Answer 1

ASP.NET经常更改服务器控件的ID，因此在Javascript中对控件ID进行硬编码并不理想。在Master Pages的演员表中，ASP.NET使用Master Page的ContentPlaceholder ID（即MainContent_btnSave）预先添加ID。

您可以使用与javascript相关联的服务器代码：<%=btnSave.ClientId%>而不是btnSave。

如果Javascript位于.ASPX文件中：

$("#<%=btnSave.ClientId%>").click(function() {
   /* ... */
}

如果JS在一个单独的文件中，只需将该按钮声明为变量并在JS代码中调用该变量。

.ASPX：

var btnSave = $("#<%=btnSave.ClientId%>");

.JS：

$(btnSave).click(function() {
   /* ... */
}

顺便说一句，如果您使用的是C＃，则可能需要使用<%=btnSave.ClientId()%>而不是VB的<%=btnSave.ClientId%>。

Answer 2

.NET Framework 4将属性“ClientIDMode”添加到控件中。设置ClientIDMode =“Static”可以使用您在控制标记中定义的确切ID。

function alertClicked(me) { alert("My ID is: " + me.id); }

<asp:Button ID="btnAlert" runat="server" Text="Alert"  OnClientClick="alertClicked(this)"/> 

--display bodycontaint_btnAlert

<asp:Button ID="btnAlert" runat="server" Text="Alert" ClientIDMode="Static" OnClientClick="alertClicked(this)" />

--display btnAlert

Answer 3

不要让母版页让您感到困惑。它只是：

$('#btnSave').click(function() {
  //ajax call like you had
});

Answer 4

如果您在head部分使用ContentPlaceHolder，请确保它位于加载jQuery的行下方。

母版页：

<head runat="server">
<script src="<%=ResolveUrl("~/Scripts/jquery-1.4.2.min.js") %>"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>

您可能还想查看生成的标记，并查看按钮的ID。如果它在嵌套的母版页或控件中，它可能不会以btnSave结束。

    <asp:Content ID="HeadContent" ContentPlaceHolderID="head" runat="server">
<script>
        $(function(){
             $('input[id*="btnSave"]').click(function(){
                  ....
             });
        });
</script>
    </asp:Content>

Answer 5

我认为你可能在使用带有jQuery的.NET母版页时遇到了一个非常普遍的问题 - 当.NET是使用母版页生成的页面的一部分时，.NET会更改元素的id，以避免名称冲突。如果您查看页面的生成的源代码，则按钮的ID可能更像ct100_panel1_btnSave。如果你想使用id调用，你需要使用该id。否则，在按钮中添加一个类，按该类选择按钮（.NET不会使用类）。

Answer 6

按钮是WebForm控件吗？如果是，那么发布表单的脚本可能会在运行javascript之前启动。

在这种情况下，使用没有runat =“server”属性的Html元素。

如果您不确定按钮的ID，只需查看呈现的HTML。

Answer 7

尝试

$("input[id$='btnSave']")...

确保它识别您的控件。

在方括号选择器的jQuery文档中，他们总是用其他东西来限定它。 input[selector]，div[selector]等。我也一直使用它们，所以jQuery可能根本不知道如何处理未作用域的属性选择器。

Answer 8

$(document).ready(function() {
    $("#btnSubmit").click(function(event) {

        //
    });
});

母版页和Jquery问题？

8 个答案: