如何将 ASP TextBox 的文本绑定到它的工具提示？

Question

我希望ToolTip始终与ASP TextBox的文本相同。当然，我可以编写 onmouseover 事件JavaScript代码来设置ToolTip，但我想知道是否有更简单的方式。

AnyTextBox.Text = "any text";
AnyTextBox.ToolTip = "any text";

但我不想复制数百个赋值语句。我也可以为Text属性编写更改事件处理程序，但我不想仅为此编写几十个事件处理程序（如果有更优雅的解决方案）。

有吗？像这样的东西：

<asp:TextBox ID="AnyTextBox" runat="server" ToolTip="binding magic goes here, but how?">

谢谢您的提前感谢。

预先感谢

- g.pickardou

Answer 1

你可以编写一个自定义控件，它继承自TextBox？我使用Text属性来设置工具提示，但如果你希望的话，也可以倒过来做。 控件：

public class TooltipTextBox : TextBox {
    public new string Text {
        get { return base.Text; }
        set
        {
            base.Text = value;
            this.ToolTip = value;
        }
    }
}

标记语言：

<my:TooltipTextBox ID="AnyTextBox" runat="server" Text="binding magic goes here">

- CodingIntrigue

---

这会隐藏原始的TextBox的Text属性，因此无法设置文本。不应该使用_text作为备份字段，而是应该使用base.Text作为备份。无论如何，谢谢 :-) - g.pickardou

@g.pickardou 呃，应该检查一下的！非常好的观点，已更新答案。 - CodingIntrigue

Answer 2

据我所知，目前没有这样的自动化工具。不过，或许你可以使用PreRender来实现此功能：

protected void Page_PreRender(Object sender, EventArgs e)
{
    var allTextControlsWithTooltips = new List<WebControl>();
    var stack = new Stack<Control>(this.Controls.Cast<Control>());
    while (stack.Count > 0)
    {
        Control currentControl = stack.Pop();
        if (currentControl is WebControl && currentControl is ITextControl)
            allTextControlsWithTooltips.Add((WebControl)currentControl);
        foreach (Control control in currentControl.Controls)
            stack.Push(control);
    }
    foreach (var txt in allTextControlsWithTooltips)
        txt.ToolTip = ((ITextControl)txt).Text;
}

您还可以使用UserControl来处理此事件，然后您只需要将其放置在所有应以此方式运行的页面上。或者您可以让所有页面从一个基础页面继承。

- Tim Schmelter

---

这真的很好。出于兴趣，您为什么选择将Control与两种类型的“WebControl”和“ITextControl”进行比较，而不是仅仅使用TextBox？ - CodingIntrigue

@RGraham：这可能是希望对于所有具有“Text”属性的Web控件（https://dev59.com/tHE85IYBdhLWcg3wzWvM），所以这就是方法。否则，只需检查“TextBoxes”。但是，如果控件嵌套在容器控件中，例如“GridViews”（已测试），此方法也适用。 - Tim Schmelter

但是ITextControl没有ToolTip属性，所以如果控件没有显式声明ToolTip属性，这可能会失败，对吗？ - CodingIntrigue

@RGraham：这就是为什么我只拿出了 WebControls 的原因；-) - Tim Schmelter

在这里 :) 谢谢！好奇心得到满足，你赢得了我的+1。 - CodingIntrigue

Answer 3

我认为使用JavaScript事件处理程序将是最简单的解决方案。 你不需要编写数百个事件处理程序。只需编写一个，然后在所有文本框中使用相同的事件处理程序即可！

<asp:TextBox ID="AnyTextBox" runat="server" onchange="setTooltip(this)" />

然后这个脚本应该是这样的

function setTooltip(textbox) {
    textbox.title = textbox.value;
}

就是这样！为想要具有此工具提示行为的所有文本框设置onchange事件即可。

- pineconesundae

---

但是工具提示应该是文本，即使用户没有更改任何内容。 - Tim Schmelter

这是非常正确的；因此，在文本框可能预填有示例文本的情况下，我的答案是不可接受的！很好的观察。 - pineconesundae

Answer 4

你可以在文本框的TextChanged事件中实现这个功能：

<asp:TextBox ID="AnyTextBox" runat="server" TextChanged="AnyTextBoxTextChanged">

protected void AnyTextBoxTextChanged(object sender, EventArgs e)
{
this.AnyTextBox.Tooltip = this.AnyTextBox.Text;
}

- aguetat

Answer 5

尝试使用jQuery

$(function () {

        var maybe = true;
        var text = $('.myTextBox').val();
        if (maybe) {
            $('.myTextBox').attr('title', text);
        }

    });

- Nikin Jasani

Answer 6

这取决于您是否正在寻找工具提示的“实时更新”=即，当用户更改网站上的文本时，您是否想要更改工具提示？然后使用输入的“onchange”事件和JS函数，在每个事件调用时更改其“title”属性。

或者您想要简化服务器端的工作，并且不想为每个项目指定工具提示和文本，则使用自定义控件方式（我推荐RGraham代码）。

或者匹配两种方法并使用自定义控件，该控件还将提供JS“刷新”代码:-)

- Gitzerai