jquery - 禁用文本框上的工具提示

Question

根据 TwitterBootstrap 文档，我引用：

要将工具提示添加到禁用或 .disabled 元素，请将元素放在 a 内<div>并将工具提示应用于该元素<div>。

单击此处获取文档

我这样做了：

    function AddToolTip(control) {
        d = jQuery(control).wrap("<div class='" + control.attr('name') + "' 
title='" + control.attr("data-title") + "' />");
        d.tooltip();
     }

这个函数被这样调用：

$('#Area').attr('disabled', true).after(AddToolTip($('#Area')));

但是工具提示没有出现，它应该在hovered或时出现clicked。

我有一个textbox我根据另一个控件启用/禁用的。textbox无论是启用还是禁用，都会显示相同的工具提示。

我在这里想念什么？

Answer 1

从函数返回元素：

    function AddToolTip(control) {
        d = jQuery(control).wrap("<div class='" + control.attr('name') + "' 
title='" + control.attr("data-title") + "' />");
        d.tooltip();
        return d;
     }

如果不从函数返回元素，则#Area在此行之后没有任何内容可附加：

$('#Area').attr('disabled', true).after(AddToolTip($('#Area')));

这导致div不被添加到DOM

Answer 2

我最终像这样修复它：

$('#Test').attr('disabled', true).wrap(function () {
   return "<div class='" + $(this).attr('name') + "'></div>";
});

这是AddToolTip()功能：

function AddToolTip(className) {
        d = $('.' + className);
        i = $('.' + className + ' :input');
        d.css({
            height: i.outerHeight(),
            width: i.outerWidth(),
            position: "top",
        })
        d.css(i.offset());
        d.attr("title", i.attr("data-title"));
        d.tooltip();
    }

希望它可以帮助别人。