asp.net中的jquery示例不起作用

Question

我在Visual Studio 2013中嘗試以下jquery / asp.net代碼示例。與下面的示例不同 - 在我的練習中，我將c＃代碼放在代碼隱藏頁面中，並將jquery代碼放在aspx標記中。 gridview顯示數據，但是當我單擊按鈕時，不會調用警報。 當我嘗試在jquery上設置調試時，沒有輸入jquery代碼。 如果有人能指出我所缺少的東西，我將不勝感激：

代碼隱藏

protected void Page_Load(object sender, EventArgs e)
{

  var myTestList = new List<MyTestClass1>
  {
     new MyTestClass1 {ID = 1, Name = "Name1"},
     new MyTestClass1 {ID = 2, Name = "Name2"},
     new MyTestClass1 {ID = 3, Name = "Name3"},
     new MyTestClass1 {ID = 4, Name = "Name4"},
     new MyTestClass1 {ID = 5, Name = "Name5"},
     new MyTestClass1 {ID = 6, Name = "Name6"}
  };


    GridView1.DataSource = myTestList;
    GridView1.DataBind();
}

public class MyTestClass1
{
   public int ID { get; set; }
   public string Name { get; set; }

}

標記

<%@ Page Language="C#" %>


<%@ Import Namespace="System.Collections.Generic" %>
<%@ Import Namespace="WebApplication1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

//--I'm doing this in code behind




</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript"    src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
    <form id="HtmlForm" runat="server">
<asp:GridView ID="GridView1" runat="server" 
    AutoGenerateColumns="false" 
    DataKeyNames="ID">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:CheckBox ID="CheckSelect" runat="server" />
                <asp:HiddenField ID="hdID" runat="server" 
                    Value='<%# Eval("ID") %>' />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField>
            <HeaderTemplate>
                Name
            </HeaderTemplate>
            <ItemTemplate>
                <asp:Label runat="server" Text='<%# Eval("Name") %>'>
                </asp:Label>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<br />
<asp:Button ID="btnGetData" runat="server" Text="Get Data" />

JavaScript的

var gridView1Control = document.getElementById('<%= GridView1.ClientID %>');

$('#<%= btnGetData.ClientID %>').click(function(e) {
    //To uncheck the header checkbox when there are no selected checkboxes in itemtemplate
    $('input:checkbox[id$=CheckSelect]:checked', gridView1Control).each(function(item, index) {

        var id = $(this).next('input:hidden[id$=hdID]').val();
        alert(id);
    });
    return false;

});

Answer 1

因為asp:GridView GridView1的元素CheckSelect獲取ID GridView1_ChkSelect_ {row_index}，而hdID獲取id GridView1_hdID_{row_index} 。 在這里你使用選擇器$= which

選擇具有指定屬性的元素，其值以與給定字符串完全相同的結尾。 比較區分大小寫。

你需要的是*=

選擇具有指定屬性的元素，其值包含給定的子字符串。

像這樣更改你的代碼。

$('input:checkbox[id*=CheckSelect]:checked',
    gridView1Control).each(function (item, index) {

    var id = $(this).next('input:hidden[id*=hdID]').val();
    alert(id);
});

asp.net中的jquery示例不起作用

問題描述

1 個解決方案

解決方案1
0 已采納 2016-08-08 17:15:10

asp.net中的jquery示例不起作用

問題描述

1 個解決方案

解決方案1 0 已采納 2016-08-08 17:15:10

解決方案1
0 已采納 2016-08-08 17:15:10