jQuery的不工作我的ASP页面

Question

我一直在试图找出什么不对的，过去几年分钟..

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

<%@ PreviousPageType VirtualPath="~/Top.aspx" %> 

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server"> 
    <style> 
     #pagediv { width: 1500px !important; } 
    </style> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $("#ddModel").change(function() { 
      var selVal = $(this).find(":selected").text(); 
      var rows = $("#gvTop tr:gt(0)"); 
      alert(selVal); 
      if (selVal == "ALL") { 
       $("#gvTop tr").show(); 
      } 
      else { 
       var rowToShow = rows.find("td:eq(3)").filter(":contains(" + selVal + ")").closest("tr"); 
       rows.show().not(rowToShow).hide(); 
      } 
     }); 
    }); 
</script> 
</asp:Content> 

仍然不知道现在。

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server"> 
    <asp:DropDownList ID="ddModel" runat="server" DataSourceID="ddmodelsource" DataTextField="Column1" DataValueField="Column1"> 
    </asp:DropDownList> 
    <asp:GridView ID="gvTop" runat="server" CellPadding="2" CellSpacing="2" GridLines="Vertical"> 
    </asp:GridView> 
</asp:Content> 

Answer 1

这是因为在内容页面中，ASP.NET将分配的ID更改为其他内容。如果你查看页面的源代码，你可以看到。因此，替代方案是使用CssClass访问控件。

例如添加CssClass您GridView和DropDownList

<asp:DropDownList ID="ddModel" runat="server" DataSourceID="ddmodelsource" DataTextField="Column1" DataValueField="Column1" CssClass="dropdown"> 
</asp:DropDownList> 

<asp:GridView ID="gvTop" runat="server" CellPadding="2" CellSpacing="2" 
     GridLines="Vertical" CssClass="grid"> 
    </asp:GridView> 

现在访问它的jQuery这样。

$(document).ready(function() { 
    $(".dropdown").change(function() { 
     var selVal = $(this).find(":selected").text(); 
     var rows = $(".grid tr:gt(0)"); 
     alert(selVal); 
     if (selVal == "ALL") { 
      $(".grid tr").show(); 
     } 
     else { 
      var rowToShow = rows.find("td:eq(3)").filter(":contains(" + selVal + ")").closest("tr"); 
      rows.show().not(rowToShow).hide(); 
     } 
    }); 
});