【问题标题】:How do I enable a popover after highlighting text?如何在突出显示文本后启用弹出框?
【发布时间】:2013-02-28 16:54:52
【问题描述】:

我试图了解说唱天才如何启用功能,使用户能够突出显示,然后在突出显示完成后显示弹出框。我将如何使用 jquery 做到这一点?

如果有帮助,我还将 twitter 引导程序用于我项目中的其他项目,包括用户单击按钮后的弹出框。

编辑:第一个示例有效(用户在输入框中选择文本),但第二个示例(用户在“内容”中选择文本)无效。

    <p class = 'content'>
    Click and drag the mouse to select text in the inputs.
    </p>
    <input type="text" value="Some text" />
    <input type="text" value="to test on" />

    <div></div>


    <script>
      $(":input").select( function () {
      $("div").text("Something was selected").show().fadeOut(500);
      });

      $("content").select( function () {
      $("div").text("Something else outside of input was selected").show().fadeOut(5000);
      });
    </script>

【问题讨论】:

  • 检查 mouseup 事件。这应该会给你一个提示。
  • @HugoDozois 我已添加并更新到现有代码。它可以与 .select 一起使用吗?

标签: jquery css twitter-bootstrap highlight popover


【解决方案1】:

使用 JavaScript

document.getElementById("myDiv").onmousedown = function(){
             //Client has pressed the mouse button without releasing it...
             this.onmouseup = function(){
                    document.getElementById("myPopUp").style.display="block";
             };
};

DEMO

使用 JQuery

$("#myDiv").mousedown(function(){

          $("#myDiv").mouseup(function(){

                     $("#myPopUp").show();
          });
});

DEMO

JQuery's .select()

当用户在其中进行文本选择时,选择事件会发送到元素。此事件仅限于input type="text" 字段和textarea 框。

【讨论】:

  • 我已经使用 .select 添加了到目前为止的代码。第一个示例有效,但第二个示例无效...在我切换之前,是否有原因导致上述无效?
  • @sharataka 第一个错误$(".content") 而不是$("content"),第二个错误.select() 仅适用于inputtextarea
猜你喜欢
  • 2015-03-30
  • 2012-05-12
  • 2012-12-20
  • 2013-02-16
  • 2015-01-08
  • 1970-01-01
  • 2012-06-26
  • 2018-08-24
  • 2014-02-09
相关资源
最近更新 更多