jquery - 是否可以根据 ajax 调用的结果触发 jquery tispy 工具提示？

Question

我正在做一个 ajax 调用，它会在成功时执行以下操作：

success: function(data) {
var allok= data.success;
if(allok == true) {
   $("#share_text").addClass('share_success').delay(2000).queue(function(next){
      $(this).removeClass("share_success");
      next();
   });
} else {
   $("#share_text").addClass('share_fail').delay(2000).queue(function(next){
     $(this).removeClass("share_fail");
     next();
   });
}
   $('#share_message').html(data.message);
   $("#share_submit").val("Share");
   $("#share_submit").removeAttr("disabled")
}

在哪里allok = false（else 块）它应该触发此文本框下方的提示工具提示，同时它正在执行 addClass/removeClass。

<input name="whatever_name" id="share_text" type="text" value="Blah blah" size="40" title="This is a tooltip">

如果我添加$('#share_text').tipsy('show')到 else 块中，它仅在您将鼠标悬停在文本框上时才有效。我如何让它自己显示？

Answer 1

你不能简单地使用jquery trigger() 函数吗？

$('#share_text').trigger('mouseenter'); // to show it
$('#share_text').trigger('mouseleave'); // to hide it

在运行上述代码之前，不要忘记首先将 Tipsy() 行为附加到#share_text。

$('#share_text').tipsy();

在您的代码中，它应该如下所示：

$(function(){

// things to do on document.ready:
$('#share_text').tipsy();
// ... more stuff

// ... until your ajax callback
success: function(data) {
var allok= data.success;
if(allok == true) {
   $("#share_text").addClass('share_success').delay(2000).queue(function(next){
      $(this).removeClass("share_success");
      next();
   });
} else {
   $("#share_text").addClass('share_fail').delay(2000).queue(function(next){
     $(this).removeClass("share_fail");
     next();
   });
}
   $('#share_message').html(data.message);
   $("#share_submit").val("Share");
   $("#share_submit").removeAttr("disabled");
// simulate a mouseenter event on share_text, to launch tipsy().show
   $('#share_text').trigger('mouseenter');
}