JQuery Ajax подсказка

Question

Я пытаюсь сделать всплывающую подсказку Ajax через этот плагин jQuery: http://jquery.bassistance.de/tooltip/demo/

У меня есть что-то вроде этого:

<p id="foottip">
  <span href="/last_votes/6">footnote</span>.
</p>

<script type="text/javascript">
  $(function() {
    $("#foottip span").tooltip({
      bodyHandler: function() {
        //dj ajax here and cache
        var tip = ''
        var url = $(this).attr("href");

        $.ajax({
          url:url, success:function(html){tip = html;}, async:false
        });

        return tip
      },

      showURL: false
    });
  })
</script>   

Я делаю это с помощью асинхронного запроса Ajax, ноРешение имеет проблему, иногда оно перенаправляет страницу.Кажется, это ошибка.Как я могу сделать всплывающую подсказку Ajax с асинхронным запросом?Я не могу найти способ передать результат во всплывающую подсказку асинхронно.

Answer 1

Я столкнулся с той же проблемой.Обнаружил умную технику здесь , которая динамически создает элемент в обратном вызове bodyHandler, а затем обновляет его в вызове AJAX, чтобы аккуратно достичь желаемого эффекта.

Применительно к указанной выше проблеме:

$("#foottip span").tooltip({
    bodyHandler: function() {
        var url = $(this).attr("href");
        var tip = $("<span/>").html("loading tip...");

        $.ajax({
            url: url,
            success: function(html){ tip.html(html); }
        });

        return tip;
    },
    showURL: false
});

Answer 2

Да, ваш код не будет работать асинхронно:

var tip = ''
var url = $(this).attr("href");
$.ajax({
    url:url, success:function(html){tip = html;}, async:true
});

// -- The problem here is that your bodyHandler function will return
// -- immediately, before the AJAX callback is called.
return tip

Чтобы решить эту проблему, вам, возможно, придется поместить код отображения всплывающей подсказки в обратный вызов success вашего запроса $.ajax.