如何使用标题动态中的文本

Question

我正在使用我在 SO 中找到的以下工具提示代码，目前文本在标题部分中是硬编码的，问题是我需要在具有不同文本标题的不同标签中使用它，而不是硬编码为所有标签，我应该如何更改它以支持具有不同标题文本的任何标签。

 <div class="form-group">
                @Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.Name)
                    <span class="label label-primary mytooltip">?</span>
                    @Html.ValidationMessageFor(model => model.Name)
                </div>

        </div>

这是脚本

 $(document).ready(    
        function () {

            $(".mytooltip").tooltip({
                animation: "true",
                placement: "right",
                title: "Tooltip texts....",
                trigger: "hover"
            });

Answer 1

做这样的事情：

$(".mytooltip").hover(function () {  // on hover event you want the tooltip with the right value.

        var tooltipText = $(this).val(); // set the value you want dynamically

        $(".mytooltip").tooltip({
            animation: "true",
            placement: "right",
            title: tooltipText,  // initialize the value of the tooltip
            trigger: "hover"
        });
   });

Answer 2

我已经为你创建了一个 jsfiddle...

代码：-

$(document).ready(    
        function () {

            $("[title]").tooltip({
                animation: "true",
                placement: "right",

                trigger: "hover"
            });
        });

将鼠标悬停在文本框上并查看工具提示是否正常工作。您需要将属性 title 添加到要在其上显示工具提示的标签。

工作示例：-http://jsfiddle.net/dwxmjkb3/10/

我已经为你更新了 jsfiddle，现在如果用户将鼠标悬停在标签上，输入或？然后它将显示工具提示。我只是将标题添加到主 div。

查看工作示例：-http://jsfiddle.net/dwxmjkb3/11/

谢谢