无法在 gridview 内单击按钮时触发 jQuery 函数答案

【问题标题】：Unable to fire jQuery function on buttons click that is inside a gridview无法在 gridview 内单击按钮时触发 jQuery 函数
【发布时间】：2013-02-07 09:34:26
【问题描述】：

我有gridview，里面有一个按钮，我想在点击时调用一个jQuery函数。

这是我的提示：

<asp:GridView ID="gvContactUs" runat="server" AllowSorting="True" AutoGenerateColumns="False"
     DataKeyNames="ContactID" Width="100%" CellPadding="3" CellSpacing="1" 
     OnPageIndexChanging="gvContactUs_PageIndexChanging"
     OnRowCommand="gvContactUs_RowCommand" 
     OnRowDataBound="gvContactUs_RowDataBound"
     OnRowDeleting="gvContactUs_RowDeleting" 
     OnSorting="gvContactUs_Sorting" AllowPaging="True"
     BackColor="White" BorderColor="White" BorderStyle="Ridge" 
     BorderWidth="2px" GridLines="None">
     <Columns>
         <asp:TemplateField HeaderText="Edit" ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="3%">
             <ItemTemplate>
                 <asp:Button Text="text" ID="hello" runat="server" />
             </ItemTemplate>
             <HeaderStyle Width="7%" />
             <ItemStyle HorizontalAlign="Center" />
         </asp:TemplateField>
         <asp:TemplateField HeaderText="Name" ItemStyle-HorizontalAlign="Left">
             <ItemTemplate>
                 <%#Eval("Name")%>
             </ItemTemplate>
             <ItemStyle HorizontalAlign="Left" />
             <HeaderStyle Width="11%" />
         </asp:TemplateField>
         <asp:TemplateField HeaderText="Email" ItemStyle-HorizontalAlign="Left" HeaderStyle-Width="13%">
             <ItemTemplate>
                 <a href="mailto:<%#Eval("Email")%>" class="EmailLink">
                 <%#Eval("Email")%></a>
             </ItemTemplate>
             <HeaderStyle Width="13%" />
             <ItemStyle HorizontalAlign="Center" />
         </asp:TemplateField>
         <asp:TemplateField HeaderText="Phone" HeaderStyle-HorizontalAlign="center" HeaderStyle-Width="7%">
             <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
             <ItemStyle HorizontalAlign="Center" Width="40px" />
             <ItemTemplate>
                 <%#Eval("Phone")%>
             </ItemTemplate>
             <HeaderStyle Width="8%" />
         </asp:TemplateField>
         <asp:TemplateField HeaderText="Status" HeaderStyle-HorizontalAlign="center" HeaderStyle-Width="7%">
             <HeaderStyle HorizontalAlign="Center"></HeaderStyle>
             <ItemStyle HorizontalAlign="Center" Width="40px" />
             <ItemTemplate>
                  <%#Eval("Subject")%>
             </ItemTemplate>
             <HeaderStyle Width="13%" />
         </asp:TemplateField>
         <asp:TemplateField HeaderText="Delete" ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="7%">
             <ItemTemplate>
                 <asp:LinkButton CommandName="Delete" CommandArgument='<%#Eval("ContactID") %>' runat="server" ID="lnkbtnDelete">
                     <img src="Images/delete.gif" border="0" alt='Click to Delete this Entry' title='Click to Delete this Entry' />
                 </asp:LinkButton>
             </ItemTemplate>
             <HeaderStyle Width="7%" />
             <ItemStyle HorizontalAlign="Center" />
         </asp:TemplateField>
     </Columns>
     <FooterStyle BackColor="#C6C3C6" ForeColor="Black" />
     <HeaderStyle Height="30px" BackColor="#3E3050" Font-Bold="True" ForeColor="#ffffff" />
     <PagerStyle ForeColor="Black" BackColor="#C6C3C6" HorizontalAlign="Right" />
     <RowStyle Height="25px" BackColor="#DEDFDE" ForeColor="Black" />
     <SelectedRowStyle BackColor="#9471DE" Font-Bold="True" ForeColor="White" />
     <SortedAscendingCellStyle BackColor="#F1F1F1" />
     <SortedAscendingHeaderStyle BackColor="#594B9C" />
     <SortedDescendingCellStyle BackColor="#CAC9C9" />
     <SortedDescendingHeaderStyle BackColor="#33276A" />
 </asp:GridView>

jQuery 代码是：

 $('[id$=hello]').live('click', function (e) {
        alert('hi8');

    });


    $(function () {

        $('input[id$=hello]').click(function () {

            alert('hikkk');
            return false;
        });
    });

这两件事我都试过了，但仍然无法调用 jQuery 函数。请帮帮我...

【问题讨论】：

$('[id$=hello]') 应该是 $('[#hello]')
时间戳：2/7/13 3:06:55 PM 错误：错误：语法错误，无法识别的表达式：[#hello] 源文件：localhost:3838/PotoMacRiverFund4.0/Admin/JsFiles/… 行：3 出错
对不起，是$('#hello') 没有[] ;)
@TomSarduy 这是不可能的，因为它是一个 ASP.NET 控件，所以 .NET 在它的 ID 之前添加了一些文本，所以该按钮不再是 ID=hello 已知的，它将是 sometexthello
@asifsid88: 哦，我明白了……我的错

标签： javascript jquery asp.net button click

【解决方案1】：

使用attributes contains 选择器* 而不是attribute ends with $。还要确保您已成功包含所需的 jQuery 库。

$(function () {    
      $('input[id*=hello]').click(function () {    
            alert('hikkk');
            return false;
      });
});

【讨论】：

【解决方案2】：

试试这个

$(document).ready(function() {
    $('input[id$=hello]').click(function() {
        //Your logic goes here
        alert('Im clicked');
    });
});

【讨论】：

【解决方案3】：

为什么不在按钮上使用OnClientClick

  <asp:Button Text="text" ID="hello" runat="server" OnClientClick="return check();" />

<script type="text/javascript">
      function check()
      {
              alert("hi")
              return false;
      }
</script>

【讨论】：

【解决方案4】：

试试这个：

$(document).on('click', '[id*="hello"]', function(){
   alert('clicked.');
});

【讨论】：