如何在突出显示文本后启用弹出窗口？

我想了解rap天才如何启用功能，使用户能够突出显示，然后在突出显示完成后显示弹出窗口。我将如何使用jQuery来做到这一点？如何在突出显示文本后启用弹出窗口？

如果有帮助，我还在我的项目中使用twitter bootstrap作为其他项目，包括用户单击按钮后的弹出窗口。

编辑：第一个示例工作（用户在输入框中选择文本），但第二个（用户选择'内容'中的文本）不起作用。

<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>

来源

2013-03-12 sharataka

检查mouseup事件。这应该给你一个提示。 – 2013-03-12 22:49:48

@HugoDozois我已经添加并更新到现有的代码。它可以用.select代替吗？ – sharataka 2013-03-12 23:13:31

使用的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字段。

来源

2013-03-12 23:03:04

我已经添加了迄今为止使用.select的代码。第一个例子是工作，但第二个不是......在我切换之前，有没有一个原因为什么上述不工作？ – sharataka 2013-03-12 23:10:00

@sharataka第一个错误，'$（“。content”）'而不是'$（“content”）'，第二个错误，'.select（）'只适用于'input'和'textarea'。 – 2013-03-12 23:15:17

如何在突出显示文本后启用弹出窗口？

回答

相关问题