代码之家  ›  专栏  ›  技术社区  ›  Mike Cellini

如何在异步回发中保持控制焦点?

  •  2
  • Mike Cellini  · 技术社区  · 14 年前

    <ajax:UpdatePanel id="UpdatePanel1" runat="server" UpdateMode="Conditional">
      <ContentTemplate>
        <asp:TextBox id="TextBox1" runat="server" AutoPostBack="true"/>
        <asp:TextBox id="TextBox2" runat="server" AutoPostBack="true"/>
      </ContentTemplate>
    </ajax:UpdatePanel>
    <asp:TextBox id="TextBox3" runat="server"/>
    

    每当TextBox1或TextBox2中发生更改时,就会发生异步回发。当然,这是通过在更改文本后将焦点移动到另一个控件来启动的。问题是,当异步回发完成控制时,获得焦点的人将失去该焦点。它是在更新面板内部还是外部并不重要。

    我尝试将javascript添加到母版页:

    <script type="text/javascript">
    
      var lastFocused = null;
    
      $(document).ready(function() {
    
        $('input').focus(function() {
          lastFocused = this;
        });
    
        $('.dropdown').focus(function() {
          lastFocused = this;
        });
    
      });
    
      function RestoreFocus(source, args) {
        if (lastFocused != null)
          lastFocused.focus();
      }
    
      function AddRequestHandler() {
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_pageLoaded(RestoreFocus);
      }
    </script>
    

    随着

    <body onload="AddRequestHandler">
    

    我知道LastFocus正在获取一个值,RestoreFocus正在运行,但是每当它运行时,LastFocus的值都是空的。

    1 回复  |  直到 14 年前
        1
  •  1
  •   Nick Craver    14 年前

    这里有几个问题,很容易解决!因为这些元素被替换了 .focus() 处理者不会坚持,你需要 .live() ,如下所示:

    var lastFocused = null;
    $(function() {
      $('input, .dropdown').live('focus', function() {
        lastFocused = this;
      });
    });
    

    focus 事件

    你也应该使用 add_endRequest 一次,像这样:

    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(RestoreFocus);
    

    endRequest 只有 在初始页面加载时。