以編程方式顯示ajax調用後的工具提示

我想知道是否有人知道如何在ajax調用後觸發工具提示的插件或教程。目前我正在使用jQuery Tools來創建工具提示。但我不希望工具提示在mouseOver事件上觸發;相反，我希望他們在ajax調用後顯示。我找不到任何有關如何實現此目標的文檔或示例。例如：以編程方式顯示ajax調用後的工具提示

<a class="vote">Vote</a> 

<div id="tooltip"> 
Some tooltip with a message. 
</div> 

$.ajax({ 
    context: this, 
    dataType: 'json', 
    success: function(response) { 
     if (response.result == "success") { 
// SHOW TOOL TIP HERE 
     } 
     else { 
// SHOW ANOTHER TOOL TIP HERE 
      } 
     });

方式jQuery的工具的工作原理是通過簡單地將元件結合到工具尖端爲這樣：（但這會導致工具提示在鼠標懸停打開）

$("#myElement").tooltip();

有一個API事件包含在jQuery工具中，但我不知道如何僅在Ajax之後顯示工具提示！另一個複雜的因素是我需要在多個元素上出現相同的工具提示（或多個工具提示）。

來源

2010-12-11 Mohamad

這裏是如何顯示一個「提示」或某些事件後彈出對話框的例子。這裏沒有ajax，只是使用鏈接的點擊操作。

$(document).ready(function() { 

    $("#vote").click(function(evt) { 
     evt.preventDefault(); 

     // Do your ajax 
     // Show the popup 
     $("#tooltip").show(); 
    }); 

    $("#tooltip").click(function() { 
     $(this).hide(); 
    }); 

});

http://jsfiddle.net/Tm8Lr/1/

希望這可以幫助您開始。

鮑勃

來源

2010-12-11 17:45:59 rcravens

感謝rcraves。我實際上得到了顯示和隱藏的工具提示。唯一的竅門是使它的位置相對於被點擊的鏈接。（我在頁面上有多個投票鏈接。） – Mohamad 2010-12-11 17:59:36

在綁定工具提示後，是否無法簡單地觸發mouseover事件？

$('#myElement').tooltip().mouseover();

來源

2010-12-11 17:42:52 karim79

卡里姆，我從來沒有想到這是誠實的。我會試一試。 – Mohamad 2010-12-11 17:53:55

只是試了一下很好的作品。謝謝！那麼簡單 – 2011-12-15 01:53:47

那個救了我一天！：D – Entea 2012-10-11 09:05:19

看一看在tooltip documentation（尤其是scripting API）和how their API works。

所以它應該工作有：

if (response.result == "success") { 
    $('#myElement').data('tooltip').show(); 
} 
else { 
    // don't know which other tooltip you want to show here 
}

You can also specify at which events the tooltip should be shown（所以你可能可以排除mouseover或將其更改爲你知道永遠不會觸發該元素的東西（如change））。

來源

2010-12-11 17:43:13

@felix，很好的答案，我沒有看tooltip api，在我的項目中我寫了自己的自定義工具提示，這就是爲什麼我給出了這樣的答案 – kobe 2010-12-11 17:46:45

Felix，謝謝你的迴應。我沒有提到的一個問題（直到我更新問題）有多個元素需要工具提示。無論如何，該工具提示是否可以重複使用，還是必須爲每個元素創建一個新的工具提示？我認爲數據（'tooltip'）僅限於一個元素。 – Mohamad 2010-12-11 17:53:20

@mel你可以給所有你想要的元素提供一個通用的類名，這可以解決你的問題 – kobe 2010-12-11 17:57:01

梅爾，

您可以編寫自己的工具提示，提示是什麼，但格箱定製的外觀和感覺，然後絕對定位。

一旦你的Ajax完成顯示工具提示通過jquerys顯示

$('#tooltipid').show();

如果你想幾秒鐘後隱藏你能做到這一點還使用jQuery JavaScript的或的setTimeout（）;

我想你想要的是，一旦阿賈克斯完成你在DOM一些新的HTML，你想顯示上述代碼的權利一些彈出，

希望這有助於

來源

2010-12-11 17:43:24 kobe

gov，非常感謝。我想過這個。但是因爲我在頁面上有很多元素需要這個元素，所以將它定位到被點擊的元素旁邊似乎非常困難。 – Mohamad 2010-12-11 17:52:04

@覺得很酷，但我認爲你可以使用相同的api來做一個.show（）它爲你工作 – kobe 2010-12-11 17:54:12

您可以使用觸發功能啓動綁定到mouseOver的其他功能。

$('#ElemWithTootip').trigger('mouseOver');

來源

2010-12-11 17:45:07 Lex

以編程方式顯示ajax調用後的工具提示

回答

相關問題