Thay thế văn bản đã chọn trong vùng văn bản

Question

cách tốt nhất để làm điều này trong jQuery là gì? Đây phải là một trường hợp sử dụng khá phổ biến.

1. tài chọn văn bản trong một textarea
2. anh ta nhấp vào một liên kết
3. Các văn bản trong các liên kết thay thế văn bản đã chọn trong textarea

Bất kỳ mã sẽ được nhiều đánh giá cao - Tôi có một số vấn đề với phần 3.

Answer 1

Dưới đây là cách bạn có thể làm điều đó, trong tất cả các trình duyệt chính. Tôi cũng có một số jQuery plug-in bao gồm chức năng này. Cùng với đó, các mã sẽ

$("your_textarea_id").replaceSelectedText("NEW TEXT"); 

Dưới đây là một giải pháp độc lập đầy đủ:

function getInputSelection(el) { 
    var start = 0, end = 0, normalizedValue, range, 
     textInputRange, len, endRange; 

    if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") { 
     start = el.selectionStart; 
     end = el.selectionEnd; 
    } else { 
     range = document.selection.createRange(); 

     if (range && range.parentElement() == el) { 
      len = el.value.length; 
      normalizedValue = el.value.replace(/\r\n/g, "\n"); 

      // Create a working TextRange that lives only in the input 
      textInputRange = el.createTextRange(); 
      textInputRange.moveToBookmark(range.getBookmark()); 

      // Check if the start and end of the selection are at the very end 
      // of the input, since moveStart/moveEnd doesn't return what we want 
      // in those cases 
      endRange = el.createTextRange(); 
      endRange.collapse(false); 

      if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) { 
       start = end = len; 
      } else { 
       start = -textInputRange.moveStart("character", -len); 
       start += normalizedValue.slice(0, start).split("\n").length - 1; 

       if (textInputRange.compareEndPoints("EndToEnd", endRange) > -1) { 
        end = len; 
       } else { 
        end = -textInputRange.moveEnd("character", -len); 
        end += normalizedValue.slice(0, end).split("\n").length - 1; 
       } 
      } 
     } 
    } 

    return { 
     start: start, 
     end: end 
    }; 
} 

function replaceSelectedText(el, text) { 
    var sel = getInputSelection(el), val = el.value; 
    el.value = val.slice(0, sel.start) + text + val.slice(sel.end); 
} 

var el = document.getElementById("your_textarea"); 
replaceSelectedText(el, "[NEW TEXT]");