是否可以根据 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');
}