JQUERY更改标题与工具提示不起作用

5
我正在使用JQUERY和JQUERY UI来更改一个小文本字符串的标题值。当页面首次加载时,工具提示正常工作,并显示我的“单击展开”工具提示。当用户单击“more…”或“less…”文本时,它应该触发点击功能(它确实这样做);切换博客文章的可见性(它确实这样做);将更多的文本切换为更少或反之亦然(它确实这样做);然后更新按钮的标题,以便工具提示显示新文本(如Chrome中所见,它确实更新)。但是,工具提示从未更改,即使标题说“折叠文章”,工具提示仍然显示“单击以获取更多信息”。
如何动态更新我的标题,以便JQUERY UI工具提示看到更新并在鼠标悬停时正确报告新值?
/*
 * 
 * @DocumentReady
 */
$(window).ready(function(){ //Checks if the document is ready

    /*
     *
     *
    */
    $(".moreButtonClass").click(function(){ //Handles the button click
        // just leaves the number and appends to make the div ID
        var postID      = "#post" + this.id.replace(/[^\d]/g, "");
        var moreButton  = "#moreButton" + this.id.replace(/[^\d]/g, "");
        $(postID).toggle(); // Toggle visibility
        if($(postID).is(":visible")) {
            $(moreButton).text("less...");
            $(moreButton).attr("title", "Collapse Post");
        } else {
            $(moreButton).text("more...");
            $(moreButton).attr("title", "Show Post");
        }
    }); //Close the function

    /*
     *
     *
    */
    $( "#tabs" ).tabs({
        beforeLoad: function( event, ui ) {
        ui.jqXHR.error(function() {
            ui.panel.html(
                "Couldn't load this tab. We'll try to fix this as soon as possible. ");
            });
        }
    }); // Close the function

    /*
     * 
     */
    $(function() {
        $( document ).tooltip({track: true}); // Allow JQUERY to handle tooltips
    }); // Close the function

}); // Close the Document Ready Function
2个回答

10

您不能使用

$(moreButton).attr("title", "Show Post");

因为提示框是由jQuery UI初始化的。请改用以下方式:

$(moreButton).tooltip( "option", "content", "Show Post - test" );

RTM: http://api.jqueryui.com/tooltip/#option-content


1
我遇到了一个“未初始化”错误,所以我的解决方案是:$(moreButton).tooltip().tooltip( "option", "content", "显示帖子 - 测试" ); - Heitor

5

我使用Jquery和Bootstrap,但它们都无法正常工作。我不得不进行以下操作:

$("#myelement").attr("data-original-title", "New title/message" );

这在使用ajax动态加载的模态框内起作用-并且原始页面元素已更改,因此它似乎很稳定。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接