0

我正在尝试将焦点设置到 ASP.Net 应用程序 (C#) 中的 TextBox 控件（位于 UpdatePanel 内）。我在后面的代码中尝试了以下内容：

tbxName.Focus();
Page.SetFocus(tbxName);
tsmManageTables.SetFocus(tbxName);

这些都不起作用，所以我去了 Javascript。这是我的 Javascript 函数：

function SetControlFocus(ctrlID) {
  var ctrl = document.getElementById(ctrlID);
  ctrl.focus();
}

这是调用它的代码中的方法：

private void SetControlFocus(Control ctrl)
{
  StringBuilder focus = new StringBuilder();
  focus.AppendLine("<script type='text/javascript'>");
  focus.AppendFormat("  SetControlFocus('{0}');" + System.Environment.NewLine, ctrl.ClientID);
  focus.AppendLine("</script>");
  ClientScript.RegisterStartupScript(this.GetType(), "setControlFocus", focus.ToString(), false);
}

和电话：

SetControlFocus(tbxName);

我也尝试过 Javascript：

(function($) {
  SetControlFocus = function(ctrlID) {
    var ctrl = $('<%= ' + ctrlID + ' %>');
    ctrl.focus();
  };
})(jQuery);

使用任一版本的 Javascript 函数，我都会收到错误消息

“对象 ctl00_MainContent_tbxName 没有方法‘焦点’”

我究竟做错了什么？

更新：

我尝试了 Karl 的建议，即使用类选择器而不是 ID 选择器和丑陋的<%= =>，但没有奏效。现在我得到一个不同的错误：

未捕获的 ReferenceError：未定义类名

使用 Javascript：

(function($) {
  SetControlFocus = function(ctrlClass) {
    var ctrl = $('.' + ctrlClass);
    ctrl.focus();
  };
})(jQuery);

标记：

<asp:TextBox ID="tbxName" runat="server" CssClass="className"></asp:TextBox>

调用方法：

private void SetControlFocus(Control ctrl)
{
  StringBuilder focus = new StringBuilder();
  focus.AppendLine("<script type='text/javascript'>");
  focus.AppendFormat("  SetControlFocus({0});" + System.Environment.NewLine, ctrl.CssClass);
  focus.AppendLine("</script>");
  ClientScript.RegisterStartupScript(this.GetType(), "setControlFocus", focus.ToString(), false);
}

调用（C#）：

SetControlFocus(tbxName);

以及为 TextBox 生成的 HTML：

<input name="ctl00$MainContent$tbxName" type="text" id="ctl00_MainContent_tbxName" class="className" />

更新 2：

我对此进行了更多尝试并取得了进展（我认为）。现在我没有收到任何错误消息，但焦点仍然没有转到 TextBox。这是我当前的 jQuery 函数：

(function($) {
  SetControlFocus = function(ctrl) {
    //give the control focus
    alert(ctrl);
    ctrl.focus();
  };
})(jQuery);

这是我称之为 C# 的方法：

private void SetControlFocus(TextBox ctrl)
{
  StringBuilder focus = new StringBuilder();
  focus.AppendLine("<script type='text/javascript'>");
  focus.AppendFormat("  SetControlFocus({0});" + System.Environment.NewLine, ctrl.ClientID);
  focus.AppendLine("</script>");
  ClientScript.RegisterStartupScript(this.GetType(), "setControlFocus", focus.ToString(), false);
} //end method SetControlFocus

请注意，我将控件的 ClientID 传递给 Javascript 函数。奇怪的是，Javascript 正在获取 ClientID 并实际“捕获”控制对象，而不是包含 ClientID 的字符串。警报正在工作，它给了我[object HTMLInputElement]警报。有小费吗？

更新 3：

我修改了 Javascript 函数：

(function($) {
  SetControlFocus = function(ctrlSelector) {
    alert(ctrlSelector);
    $(ctrlSelector).focus();
  };
})(jQuery);

和调用方法：

private void SetControlFocus(TextBox ctrl)
{
  StringBuilder focus = new StringBuilder();
  focus.AppendLine("<script type='text/javascript'>");
  focus.AppendFormat("  SetControlFocus('{0}');" + System.Environment.NewLine, "#" + ctrl.ClientID);
  focus.AppendLine("</script>");
  ClientScript.RegisterStartupScript(this.GetType(), "setControlFocus", focus.ToString(), false);
}

（注意在参数 - 周围添加了单引号'{0}'）。

现在我得到了正确的选择器（警报以 响应#ctl00_MainContent_txtName），没有错误，但 TextBox仍然没有获得焦点。

4

3 回答 3

0

我终于想出了一种方法来完成这项工作！我将 jQuerySetControlFocus()调用移到了另一个 jQuery 函数中，该函数是从后面的代码中调用的。方法调用背后的代码MessageDialog()，现在看起来像这样：

(function($) {
  MessageDialog = function(title, dialogText, focusID) {
    //add the dialog div to the page
    $('body').append(String.Format("<div id='messageDialog' title='{0}'><p>{1}</p></div>", title, dialogText));
    //create the dialog
    $('#messageDialog').dialog({
      modal: true,
      resizable: false,
      draggable: false,
      close: function(event, ui) { $('body').find('#messageDialog').remove(); },
      buttons:
        [{
          text: 'OK',
          click: function() {
          $(this).dialog('close');
          //Set focus to the control object in argument #3 (if provided)
            if (focusID.length > 0) {
              SetControlFocus(focusID);
            }
          }
        }]
      });
    };
})(jQuery);

SetControlFocus()遗迹：

(function($) {
  SetControlFocus = function(ctrlSelector) {
    $(ctrlSelector).focus();
  };
})(jQuery);

我在 C# 中的调用方法（这是我已经拥有的方法的重载）是：

private void DisplayMessageDialog(string msgTitle, string msgText, string ctrlID)
{
  StringBuilder msg = new StringBuilder();
  msg.AppendLine("<script type='text/javascript'>");
  msg.AppendFormat("  MessageDialog('{0}', '{1}', '{2}');" +
    System.Environment.NewLine, msgTitle, msgText, "#" + ctrlID);
  msg.AppendLine("</script>");
  ClientScript.RegisterStartupScript(this.GetType(), "messageDialog", msg.ToString(), false);
} //end method DisplayMessageDialog (overload #2 - specifies a control to get focus
  //after the dialog is dismissed)
于 2013-11-14T20:08:48.150 回答
0

您的第二个 javascript 缺少用于表示 ID 选择的井号。

(function($) {
  SetControlFocus = function(ctrlID) {
    var ctrl = $('#<%= ' + ctrlID + ' %>');
    ctrl.focus();
  };
})(jQuery);

这应该可以解决问题。

于 2013-11-12T22:13:42.723 回答
0

您缺少#ID 选择器。

要么这样做：

var ctrl = $('#<%= ' + ctrlID + ' %>');

class或者在您的 ASP.NETTextBox控件中使用名称，如下所示：

<asp:TextBox id="TextBox1" runat="server" CssClass="TheTextBox" />

现在你的选择器变成了这样：

var ctrl = $('.TheTextBox');

注意：使用类选择器与 ID 选择器相比，可以极大地简化选择器语法并删除<%= ... %>您使用的粗糙的嵌入代码块 ( ) 语法。虽然它不如 ID 选择器快，但在我看来，更简单、更易于维护的代码所带来的好处绝对值得。

更新：

将整个选择器值用单引号括起来，如下所示：

var ctrl = $("'." + ctrlClass + "'");
于 2013-11-12T22:19:14.097 回答