如何在FireFox浏览器上隐藏Powertip工具提示

时间:2019-04-17 08:42:44

标签: javascript jquery

我正在使用jQuery Powertip编写消息传递工具。我要:

    点击选择后
  • 显示工具提示
  • 选择选项后隐藏工具提示

它只能在Chrome浏览器上正常运行,但不能在Firefox上正常运行。在Firefox上,选择。后不会隐藏工具提示。

我尝试使用其他事件来更改代码,但不起作用

$(function() {
  $('select').powerTip({
    manual: true,
    placement: "sw-alt",
    fadeOutTime: 0,
    closeDelay: 0
  });

  $("#bar").on("focus click", function() {
    var tooltipText = 'Message!';
    $(this).data("powertip", tooltipText);
    $.powerTip.show(this);
  });

  $("#bar").on("input change", function() {
    $.powerTip.hide();    
    document.activeElement.blur()
  });
});
<h1>Tooltip</h1>
<select name="foo" id="bar">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
</select>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-powertip@1.3.1/dist/jquery.powertip.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jquery-powertip@1.3.1/dist/css/jquery.powertip.css">

jsFiddle的示例在这里:https://jsfiddle.net/keke3/7xk3njz8/7/

1 个答案:

答案 0 :(得分:0)

尝试以下操作...

    {% for item in key_tp_list %}
        <li>{{ item.eid }} | {{ item.user }} | {{ item.start_time }} | {{ item.note }}</li>
    {% endfor %}

工作示例:https://jsfiddle.net/y2f5wx7d/