如何为jquery mouseup选择wrods包装html标签？

发布于 2024-12-10 05:09:34 字数 2391 浏览 1 评论 0原文

我在这里参考了答案用 getSelection 选择整个单词。我想从body中进行mouseup选择完成的单词。而不是将

标签包装为选择词。这是代码。那么如何呢？谢谢。

<script src="jquery.js"></script>
<script>
(function($) {
function getSelected() {
  if(window.getSelection) { return window.getSelection(); }
  else if(document.getSelection) { return document.getSelection(); }
  else {
    var selection = document.selection && document.selection.createRange();
    if(selection.text) { return selection.text; }
    return false;
  }
  return false;
}

function expand(range) {
    if (range.collapsed) {
        return;
    }

    while (range.toString()[0].match(/\w/)) {
        range.setStart(range.startContainer, range.startOffset - 1);   
    }

    while (range.toString()[range.toString().length - 1].match(/\w/)) {
        range.setEnd(range.endContainer, range.endOffset + 1);
    }
}

$(document).ready(function() {
  $('body').mouseup(function() {
    var selectionRange = getSelected().getRangeAt(0);
    var start = selectionRange.startOffset; 
    expand(selectionRange);
    var selection = selectionRange.toString();
    if(selection && (selection = new String(selection).replace(/^\s+|\s+$/g,''))) {
        //how to wrap <p> tag for the selection words?
    }
  });
});
})(jQuery);
</script>
<style>
p {color:blue; }
</style>
<body>
Facebook needs to scrape your page to know how to display it around the site.

Facebook scrapes your page every 24 hours to ensure the properties are up to date. The page is also scraped when an admin for the Open Graph page clicks the Like button and when the URL is entered into the Facebook URL Linter. Facebook observes cache headers on your URLs - it will look at "Expires" and "Cache-Control" in order of preference. However, even if you specify a longer time, Facebook will scrape your page every 24 hours.

The user agent of the scraper is: "facebookexternalhit/1.1 (+http://www.facebook.com/externalhit_uatext.php)"
</body>

更新：

var new_html = $('body').html().split(selection, 1)[0] + '<p>' + selection + '</p>' + $('body').html().split(selection, 2)[1];
$('body').html(new_html);

原文

I have reference the answer here Select whole word with getSelection. I would like to make a mouseup selection completed words from body. than wrap <p> tag for the selection words. Here is the code. So how to? Thanks.

<script src="jquery.js"></script>
<script>
(function($) {
function getSelected() {
  if(window.getSelection) { return window.getSelection(); }
  else if(document.getSelection) { return document.getSelection(); }
  else {
    var selection = document.selection && document.selection.createRange();
    if(selection.text) { return selection.text; }
    return false;
  }
  return false;
}

function expand(range) {
    if (range.collapsed) {
        return;
    }

    while (range.toString()[0].match(/\w/)) {
        range.setStart(range.startContainer, range.startOffset - 1);   
    }

    while (range.toString()[range.toString().length - 1].match(/\w/)) {
        range.setEnd(range.endContainer, range.endOffset + 1);
    }
}

$(document).ready(function() {
  $('body').mouseup(function() {
    var selectionRange = getSelected().getRangeAt(0);
    var start = selectionRange.startOffset; 
    expand(selectionRange);
    var selection = selectionRange.toString();
    if(selection && (selection = new String(selection).replace(/^\s+|\s+$/g,''))) {
        //how to wrap <p> tag for the selection words?
    }
  });
});
})(jQuery);
</script>
<style>
p {color:blue; }
</style>
<body>
Facebook needs to scrape your page to know how to display it around the site.

Facebook scrapes your page every 24 hours to ensure the properties are up to date. The page is also scraped when an admin for the Open Graph page clicks the Like button and when the URL is entered into the Facebook URL Linter. Facebook observes cache headers on your URLs - it will look at "Expires" and "Cache-Control" in order of preference. However, even if you specify a longer time, Facebook will scrape your page every 24 hours.

The user agent of the scraper is: "facebookexternalhit/1.1 (+http://www.facebook.com/externalhit_uatext.php)"
</body>

UPDATE:

var new_html = $('body').html().split(selection, 1)[0] + '<p>' + selection + '</p>' + $('body').html().split(selection, 2)[1];
$('body').html(new_html);

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

一枫情书 2024-12-17 05:09:34

试试这个：

(function($) {
function getSelected() {
  if(window.getSelection) { return window.getSelection(); }
  else if(document.getSelection) { return document.getSelection(); }
  else {
    var selection = document.selection && document.selection.createRange();
    if(selection.text) { return selection.text; }
    return false;
  }
  return false;
}

function expand(range) {
    if (range.collapsed) {
        return;
    }

    while (range.toString()[0].match(/\w/)) {
        range.setStart(range.startContainer, range.startOffset - 1);   
    }

    while (range.toString()[range.toString().length - 1].match(/\w/)) {
        range.setEnd(range.endContainer, range.endOffset + 1);
    }
}

$(document).ready(function() {
  $('body').mouseup(function() {
    var selectionRange = getSelected().getRangeAt(0);
    var start = selectionRange.startOffset; 
    expand(selectionRange);
    var selection = selectionRange.toString();
    if(selection && (selection = new String(selection).replace(/^\s+|\s+$/g,''))) {
        var el = $('body');
        el.html(el.html().replace(selection, "<p>"+selection+"</p>"));    }
  });
});
})(jQuery);

http://jsfiddle.net/CHhJG/

Try this:

(function($) {
function getSelected() {
  if(window.getSelection) { return window.getSelection(); }
  else if(document.getSelection) { return document.getSelection(); }
  else {
    var selection = document.selection && document.selection.createRange();
    if(selection.text) { return selection.text; }
    return false;
  }
  return false;
}

function expand(range) {
    if (range.collapsed) {
        return;
    }

    while (range.toString()[0].match(/\w/)) {
        range.setStart(range.startContainer, range.startOffset - 1);   
    }

    while (range.toString()[range.toString().length - 1].match(/\w/)) {
        range.setEnd(range.endContainer, range.endOffset + 1);
    }
}

$(document).ready(function() {
  $('body').mouseup(function() {
    var selectionRange = getSelected().getRangeAt(0);
    var start = selectionRange.startOffset; 
    expand(selectionRange);
    var selection = selectionRange.toString();
    if(selection && (selection = new String(selection).replace(/^\s+|\s+$/g,''))) {
        var el = $('body');
        el.html(el.html().replace(selection, "<p>"+selection+"</p>"));    }
  });
});
})(jQuery);

http://jsfiddle.net/CHhJG/

回复收藏 0 原文

~没有更多了~