Javascript: Cách phát hiện xem một từ có được đánh dấu là

Question

Tôi đang viết một addon Firefox được kích hoạt bất cứ khi nào một từ được tô sáng. Tuy nhiên tôi cần một kịch bản phát hiện khi một từ được tô sáng, và tôi bị kẹt. Một ví dụ sẽ là nytimes.com (khi bạn đang đọc một bài báo và bạn đánh dấu một từ, biểu tượng tham chiếu bật lên). Tuy nhiên, kịch bản nytimes.com là siêu phức tạp. Tôi 16 tuổi và không có nhiều lập trình viên, vì vậy đó chắc chắn là cách ra khỏi giải đấu của tôi.

Answer 1

Đây là một kịch bản:

<script language=javascript> 
function getSelText() 
{ 
    var txt = ''; 
     if (window.getSelection) 
    { 
        txt = window.getSelection(); 
             } 
    else if (document.getSelection) 
    { 
        txt = document.getSelection(); 
            } 
    else if (document.selection) 
    { 
        txt = document.selection.createRange().text; 
            } 
    else return; 
document.aform.selectedtext.value = txt; 
} 
</script> 
<input type="button" value="Get selection" onmousedown="getSelText()"> 
<form name=aform > 
<textarea name="selectedtext" rows="5" cols="20"></textarea> 
</form> 

Courtesy của Bộ luật Toad:

http://www.codetoad.com/javascript_get_selected_text.asp

Trong trường hợp của bạn, bạn sẽ muốn gọi kịch bản này khi lựa chọn được thực hiện, và sau đó bạn Tuy nhiên, bạn có thể xử lý nó theo yêu cầu của AJAX để lấy thông tin liên quan, ví dụ như NYtimes có thể làm.

Answer 2

Cách dễ nhất để thực hiện việc này là phát hiện các sự kiện mouseup và keyup sự kiện trên tài liệu và kiểm tra xem có bất kỳ văn bản nào được chọn hay không. Sau đây sẽ làm việc trong tất cả các trình duyệt chính.

Ví dụ: http://www.jsfiddle.net/timdown/SW54T/

function getSelectedText() { 
    var text = ""; 
    if (typeof window.getSelection != "undefined") { 
     text = window.getSelection().toString(); 
    } else if (typeof document.selection != "undefined" && document.selection.type == "Text") { 
     text = document.selection.createRange().text; 
    } 
    return text; 
} 

function doSomethingWithSelectedText() { 
    var selectedText = getSelectedText(); 
    if (selectedText) { 
     alert("Got selected text " + selectedText); 
    } 
} 

document.onmouseup = doSomethingWithSelectedText; 
document.onkeyup = doSomethingWithSelectedText; 

Answer 3

Sử dụng rangy.js và jQuery:

$('#elem').on('keyup mouseup', function(){ 
    var sel = rangy.getSelection() 
    if (sel.rangeCount === 0 || sel.isCollapsed) return 
    alert(sel.toString()) 
}) 

Answer 4

Sử dụng đoạn mã sau

(function() { 
     "use strict"; 
     var showSelectedText = function (e) { 
      var text = ''; 
      if (window.getSelection) { 
       text = window.getSelection(); 
      } else if (document.getSelection) { 
       text = document.getSelection(); 
      } else if (document.selection) { 
       text = document.selection.createRange().text; 
      } 

      console.log(text.toString()); 
     } 

     document.onmouseup = showSelectedText; 
     if (!document.all) { 
      document.captureEvents(Event.MOUSEUP); 
     } 

})();