Question

我们的页面中有一个搜索文本框和搜索按钮。当用户输入搜索字符串并按Enter键时，我们需要触发服务器端按钮单击事件。代码位于用户控件（ascx）中。代码是....

ascx

<td class="search_txt_box">
  <asp:TextBox ID="txtSearchBox" class="frmdefault" runat="server"
               MaxLength="100" Width="300"></asp:TextBox>
</td>
<td class="new_search_btn">
  <asp:LinkButton ID="btnSearchHelp" class="ovalbutton" runat="server"
            OnClick="btnSearchHelp_Click">
    <span id="spanBtnTxt" runat="server" class="btn_arrow_space"></span>
  </asp:LinkButton>
</td>

JQuery的

  (function ($) {
     $(function () {
          $('input[id$="txtSearchBox"]').keypress(function (e) {
        var keyCode;

        if (window.event) keyCode = window.event.keyCode;
        else if (e) keyCode = e.which;
        else return true;

        if (keyCode == 13) {
            //alert("Out - Clicked");
            //alert($('[id*="btnSearchHelp"]').attr('id'));

            $('[id*="btnSearchHelp"]').click();
            return false;
            //$('[id*="btnSearchHelp"]').on('click', 'a', function (e) {
            //    alert('this is the click');
            //    e.preventDefault();
            //});
        }
    });
     });
  } (jQuery));

ascx.cs

protected void btnSearchHelp_Click(object sender, EventArgs e)
{
   //handle search click
}

我们尝试在论坛中寻找答案并尝试了一些，但没有一个有效。显示“Out-Clicked”警报和带有按钮动态ID的下一个警报，但之后没有任何反应。我们写了一个内联的Jquery函数，但即便没有调用它。谁能告诉我们我们在这里做错了什么？

Answer 1

如果更改标记不是不可能的，您可以将搜索输入包装在表单元素中，并使用该表单上的submit()事件。

这样两次点击返回并点击“搜索”按钮就会触发事件。

Answer 2

我认为你的问题在这里：

(function ($) { 

      //you are trying to capture domready function in this
      //This is actually a way to author a jQuery Plugin

} (jQuery));
      //  ^-------------------------
      // although you have put one extra paranthesis ")" at the closing
      // this doesn't matter this won't work if you remove it though

If you are using different js libraries并且您在库中facing issues of conflict，那么您必须在此闭包中save your '$' sign，如上所述。虽然同样的事情you can do with your doc ready的功能为this way：

jQuery(function($){

   // I just used a simple alert function to test
   // You can do your stuff here.
   alert('123');
});

您在此处附上$标志。这样您就不会受到其他库的冲突。

您可以在此处找到更多信息：http://docs.jquery.com/Plugins/Authoring

Answer 3

问题是因为使用链接按钮。

呈现链接按钮时，它就像

<a id="btnSearchHelp" class="ovalbutton" href="javascript:__doPostBack('btnSearchHelp','')"><span id="spanBtnTxt">

来自JS的Click事件将触发 onclick 属性中定义的处理程序。在您的情况下，定义了href属性，并且不会触发href属性。

选项：

1）您可以使用asp：按钮代替asp：link按钮。

2）使用以下代码而不是$（'[id * =“btnSearchHelp”]'）。click（）;

var submitButton = $('[id*="btnSearchHelp"]');
var events = submitButton.data('events');
                if (submitButton.get(0).onclick) {
                    eval(submitButton.get(0).onclick());
                }
                if (events != null && events.click != null && events.click.length > 0) {
                    $(submitButton).trigger(events.click);
                    $.each(events.click, function (index, evt) {
                        evt.handler();
                    });
                }

                if ($.trim(submitButton.attr("href")) != "") {
                    if (submitButton.attr("href").toString().toLowerCase().indexOf("javascript:") != -1) {
                        eval(submitButton.attr("href"));
                    }
                }

希望它对你有所帮助。

JQuery - 按钮单击不激活

3 个答案: