javascript - 如何在 jQuery 单击函数中添加并显示 Bootstrap 工具提示？

Question

我正在尝试从 jQuery 的单击函数中添加并显示 Bootstrap 3 工具提示。

当我为点击处理程序使用匿名函数时，它工作得很好，但如果我尝试将代码放入命名函数中，我会收到错误 TypeError: undefined is not a function (evaluating '$button .tooltip(...

JS文件的内容如下。这是在 jQuery 和 bootstrap.min.js 之后加载的。

$(function() {
    function confirmClick(event) {
        event.preventDefault();

        $button = event.target;
        console.log($button);

        $button.tooltip({
            title: 'Are you sure?',
            trigger: 'manual',
        }).tooltip('show');

        $button.unbind('click');
    }

    $('.btn-confirm').click(confirmClick);
})

最终，我希望使用 setTimeout 重新添加点击处理程序并在 X 秒后隐藏工具提示。

最终行为将是用户单击按钮，出现一个工具提示，询问“您确定吗？”如果他们在 X 秒之前再次点击，则链接会被点击。如果没有，则隐藏工具提示，并为下一次单击准备相同的操作。

我还尝试使用手动或点击触发器添加工具提示，然后在confirmClick()函数中对其进行操作，但任何从命名点击函数中点击.tooltip的尝试似乎都会失败。

Answer 1

您需要使用 jQuery 选择器包装您的目标才能使用 .tooltip()。

执行$button = $(event.target);而不是$button = event.target;。

当且仅当您的变量存储 jQuery 对象时，才在变量前面加上 $。