使用jQuery select（）选择div的内容

是否可以使用或调整jQuery的.select（）来设置div的整个内容的选择范围？

我有一个div，它有一系列标签，输入，选择对象和一些其他UI元素。 我在一个单独的StackOverflowpost上找到了代码，其中一些代码托管在jsFiddle上： http ： //jsfiddle.net/KcX6A/570/

这可以适应选择输入值吗？ 或者你会怎么建议我这样做？

谢谢，康纳

---

编辑：更多信息

我知道如何使用jQuery获取输入的值，这很容易，我也知道如何使用.select（）选择独立元素的值。

在我的div中，我有一系列不同的元素类型，包括输入，标签，选择等。我需要对所有元素进行全面选择。 我之前添加的jsFiddle链接显示了如何设置div的范围并选择像p标签等元素的文本。我需要的是设置div的内容范围，当我点击ctrl + c或cmd + c时复制输入值和标签。

总而言之，使用.val和.select不会起作用，我不这么认为。 我需要以某种方式结合上述内容，但不确定如何实现。 有任何想法吗？

Answer 1

检查这个小提琴： http ： //jsfiddle.net/JAq2e/

基本上诀窍是引入一个隐藏的文本节点，其内容将在复制时包含在选择中。

 jQuery.fn.selectText = function(){ this.find('input').each(function() { if($(this).prev().length == 0 || !$(this).prev().hasClass('p_copy')) { $('
').insertBefore($(this)); } $(this).prev().html($(this).val()); }); var doc = document; var element = this[0]; console.log(this, element); if (doc.body.createTextRange) { var range = document.body.createTextRange(); range.moveToElementText(element); range.select(); } else if (window.getSelection) { var selection = window.getSelection(); var range = document.createRange(); range.selectNodeContents(element); selection.removeAllRanges(); selection.addRange(range); } }; 

并使用它像：

 $('#selectme').selectText(); 

---

如果要创建选择链接，可以将上述插件与事件处理程序耦合：

代码：

 $('.select-text').on('click', function(e) { var selector = $(this).data('selector'); $(selector).selectText(); e.preventDefault(); }); 

用法：

 Select all 
some text 

演示：见js小提琴

Answer 2

如果要选择内部表单元素。 使用.focus() /.blur()和.val()函数。

  $('input').focus(); //focus on input element $('input').val(); //return the value of input 

Answer 3

并不是的。 在大多数浏览器中，不可能同时选择多个输入的内容。 见http://jsfiddle.net/timdown/D5sRE/1/

Answer 4

如果要与每个东西一起选择输入元素。

这是一个jQuery混合的JS解决方案

 function selectElement(element) { if (window.getSelection) { var sel = window.getSelection(); sel.removeAllRanges(); var range = document.createRange(); range.selectNodeContents(element); sel.addRange(range); } else if (document.selection) { var textRange = document.body.createTextRange(); textRange.moveToElementText(element); textRange.select(); } } selectElement($("div")[0]); //Select the div $("input").trigger("select"); //select the inputs 

演示