Question

我使用带有onserverclick属性的html按钮时遇到了一些非常奇怪的行为。我想要做的是使用jQuery指定页面上的默认按钮。默认情况下，按钮是指用户点击进入时“点击”的按钮。在测试中，我会在输入字段中按Enter键，有时会单击预期的“默认”按钮，并且在相应的onserverclick属性中定义了服务器端方法。其他时候回复是在没有达到服务器方法的情况下进行的。为了隔离这个问题，我创建了一个最小的测试用例，并发现了一些非常有趣的结果。

客户方：

<html xmlns="http://www.w3.org/1999/xhtml">
  <head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript" src="/scripts/jquery-1.4.min.js"></script>
  </head>
  <body>
    <form id="form1" runat="server">
      <asp:Label ID="_response" runat="server"></asp:Label>
      <input id="input1" type="text" />
      <input id="input2" type="text" />
      <button id="first" type="button" class="defaultBtn" runat="server" onserverclick="ServerMethod1">test1</button>
      <button id="second" type="button" runat="server" onserverclick="ServerMethod2">test2</button>
    </form>
    <script type="text/javascript">
      jQuery('form input').keyup(
        function(e) {
          if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
            $('button.defaultBtn').click();
            return true;
          }
        }
      );
    </script>
  </body>
</html>

服务器端：

public partial class admin_spikes_ButtonSubmitTest : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void ServerMethod1(object sender, EventArgs e)
    {
        _response.Text = "server method1 was hit";
    }



    protected void ServerMethod2(object sender, EventArgs e)
    {
        _response.Text = "server method2 was hit";
    }

}

我发现除了删除其中一个输入元素之外，所有内容都按照预期使用此代码。在Firefox 3.6和IE 8中，当页面上只存在一个输入时，点击输入不会触发onserverclick，它会发回一个帖子，甚至没有jQuery“点击”或实际“点击”。您可以通过从两个输入开始并单击“test2”来测试它。这将输出“服务器方法2被击中”。然后只需按Enter键，输出将是“服务器方法1被击中。现在拿走输入并运行相同的测试。单击”test2“查看结果，然后按回车键，您将看到没有任何内容会因为”test1“而改变方法从未被击中。有谁知道发生了什么事？

谢谢

P.S。 Chrome按预期工作

Answer 1

试试这个：

  jQuery('form input').keyup(
    function(e) {
      if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {            
         $('#__EVENTTARGET').val($('.defaultBtn').attr('name') );
         document.forms[0].submit();
        return true;
      }
    }
  );

或者您可以使用DefaultButton表单的属性：

<asp:Form runat="server" id="form1" DefaultButton="first">
...
</asp:Form>

asp.net中的html button elemenents和onserverclick属性

1 个答案: