启用jQuery mouseover事件

时间:2014-03-27 11:52:22

标签: javascript jquery tooltip

我有一些代码在链接悬停时显示消息。这是使用工具提示器,最初在页面加载时它工作正常。当我点击一个单选按钮时,我的问题就出现了,这反过来又将类tooltipbfile的文本更改为我想要的内容,但是当我点击更改文本时,它似乎已经失去了悬停功能。没有显示工具提示。我是否必须在某处启用mouseenter事件。我查看了像$(".tooltipbfile").prop('enabled', true);这样的代码,但它没有任何区别。

如果有人能告诉我在点击事件后重新启用鼠标事件的正确方法,我将不胜感激。感谢

更新:根据工具提示API。 $( “tooltipbfile”)tooltipster( '禁用');

jQuery代码

$(function() {
 $('input:radio').click(function(){
  if($(this).val()=='New Intake'){
     $("#fileref").hide();
     $(".maxbox").show();
     $("#INTKAddMoreFileBox").show();
     $(".tooltipbfile").text("Help");

  }else if($(this).val()=='New Intake Files'){
     $("#fileref").show();
     $(".maxbox").hide();
     $(".tooltipbfile").text("Some text here.").show();
     $("#INTKAddMoreFileBox").hide();
     $(".tooltipbfile").tooltipster('disable');
  }

});
});

工具提示码

在页面加载时正常工作

<script type="text/javascript">
$(document).ready(function() {
            $('.tooltipbfile').tooltipster({
            theme: 'tooltipster-light',
            position: 'right',
            animation: 'fade',
            fixedWidth: 200,
            maxWidth: 290,
            content: $('<span>blah blah blah</span>')
            });
        });
</script>

HTML

相关部分

<div class="fieldset">
  <h1><span>Enter Box(es) Reference</span></h1>
  <p>
    <a href="#" id="INTKAddMoreFileBox" class="btn btn-info">Add More Boxes</a>
    <span class="maxbox" style="margin-left:10px;font-size:10px;color: grey;">( Maximum 8 )</span>
    <!--<div class="bxhelp">
      You now have the ability to input more than 1 box just by clicking the Add More boxes link. Please only enter 1 box reference per box. You can enter up to a maximum of 8 boxes.
      <a href="javascript:void(0)" class="boxhelpcls">Close</a>
      </div>-->
  <div id="INTKInputsWrapper">
    <p>
      <input name="box_add[]" type="text" required="required />
      <a href="javascript:void(0)" class="removeclass"></a>
      <a style="margin-left: 14px;" href="javascript:void(0)" class="tooltipbfile">Help</a>
    </p>
  </div>
  </p>
</div>
<div class="fieldset" id="fileref">
  <h1><span>Enter File References</span></h1>
  <p>
    <a href="javascript:void(0)" id="BFINTKAddMoreFile" class="btn btn-info">Add More Files</a>
    <span class="fmaxbox" style="margin-left:10px;font-size:10px;color: grey;">( Maximum 8 )</span>
    <!--<div class="fbxhelp">
      You now have the ability to input more than 1 file just by clicking the Add More files link. You can enter up to a maximum of 8 files.
      <a href="javascript:void(0)" class="fboxhelpcls">Close</a>
      </div>-->
  <div id="BFINTKInputsWrapper">
    <p>
      <input name="bfile_add[]" id="bfile_add[]" type="text" required="required" />
      <a href="javascript:void(0)" class="removeclass"></a>
      <a style="margin-left: 14px;" href="javascript:void(0)" class="fboxhelp">Help</a>
    </p>
  </div>
  </p>
</div>

1 个答案:

答案 0 :(得分:0)

单击对象将其重新转换为tooltipb文件后,只需在其上重新调用tooltipster(),就像程序在document.ready上所做的那样:

.tooltipster({
        theme: 'tooltipster-light',
        position: 'right',
        animation: 'fade',
        fixedWidth: 200,
        maxWidth: 290,
        content: $('<span>blah blah blah</span>')
        });

我从未使用过tooltipster,但这应该可行。