从外部html文件中选择文本 - jQuery

时间:2015-12-22 10:49:04

标签: jquery html

我通过点击链接将html代码加载到div中:

$( "#test1" ).click(function() {
  $( "#anothertest" ).load( "./templates/test1.html" );
});

如果它在同一个html文档中,则以下Jquery代码可以工作(但是因为我从外部代码中将一些额外的代码加载到div中它不起作用):

jQuery.fn.selectText = function(){
  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);
  };


$("#select-button").click(function() {
  $(".testcont").selectText();
});

外部html文件代码:

<link rel="stylesheet" type="text/css" href="./style/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="./js/script.js"></script>


<div class="testcont">some text to be selected</div>
<br>
<button type="button" id="select-button">Select Text</button>

这可以以某种方式完成吗?

提前感谢您的回答。

1 个答案:

答案 0 :(得分:1)

由于您要加载新内容,因此需要delegate the events

$("body").on("click", "#select-button", function() {
  $(".testcont").selectText();
});