phát hiện vị trí kết thúc lựa chọn bằng cách sử dụng javascript

Question

Tôi đã viết mã để phát hiện kết thúc lựa chọn bằng javascript và đặt điểm đánh dấu ở vị trí cuối. Xem jsfiddle này: http://jsfiddle.net/vCwwN/

Đoạn mã trên thực hiện như sau:

• Nó xử lý tất cả các kịch bản LTR (ví dụ tiếng Anh) đúng (hiển thị đánh dấu ở cuối một cách chính xác).
• Đối với các kịch bản LTR (ví dụ tiếng Anh) Nó xử lý việc lựa chọn có chuyển tiếp hay không (từ phải sang trái/phải) hoặc ngược (từ phải/dưới sang trái/trên). hoặc bàn phím).
• Nó sử dụng getClientRects để tìm tất cả các ranh giới hình chữ nhật lựa chọn, và một hack để phát hiện hướng lựa chọn (nếu lạc hậu hay không). Tùy thuộc vào hai thông tin này, nó đặt điểm đánh dấu ở cuối.

Bạn có thể thử chọn những gì được mô tả ở trên cho tập lệnh tiếng Anh mà không gặp bất kỳ sự cố nào. Vấn đề duy nhất là khi bạn cố gắng xử lý các tập lệnh RTL (ví dụ: tiếng Ả Rập), thì trình đánh dấu ở đầu tập lệnh RTL đã chọn thay vì kết thúc (nơi chuột/bàn phím thực sự dừng). Những vấn đề này gây ra:

• Bắt đầu lựa chọn bên trong RTL kịch bản (tiếng Ả Rập), và kết thúc lựa chọn bên trong RTL kịch bản (tiếng Ả Rập). Điều này cho thấy điểm đánh dấu ở đầu lựa chọn.
• Bắt đầu lựa chọn bên trong tập lệnh LTR (tiếng Anh) và kết thúc lựa chọn bên trong tập lệnh RTL (tiếng Ả Rập). Điều này cho thấy điểm đánh dấu khi bắt đầu lựa chọn kịch bản RTL (thay vì kết thúc của nó).

Về cơ bản, lựa chọn bắt đầu từ bất kỳ đâu (LTR hoặc RTL) và kết thúc trong tập lệnh RTL không chính xác. Bất kỳ trường hợp nào khác được xử lý một cách chính xác (ví dụ: bắt đầu bằng LTR hoặc RTL và kết thúc bằng LTR, thậm chí truyền qua các kịch bản RTL trên đường đi).

Vấn đề là hướng của luồng được chuyển cho tập lệnh RTL, và do đó lùi lại là tiến lên và tiến về phía trước là lùi. Đây là lý do tại sao mã của tôi không thể xử lý RTL đúng cách và quá trình hack ngược được đảo ngược.

Một giải pháp mà tôi nghĩ là phát hiện ký tự cuối cùng của lựa chọn, và xem liệu nó có tập lệnh RTL hay không, sau đó dựa trên điều này lật cờ lùi. Tôi đã đặt một hàm để phát hiện xem một văn bản có kết thúc bằng một ký tự RTL hay không (nó nằm trong cùng một jsfiddle chưa được sử dụng). Nó có thể giúp bạn, giúp tôi giải quyết nó :)

Answer 1

Xem đây có phải là một bước đi đúng hướng không.

Nó thúc đẩy các mã sau vào Return HTML from a user selection đăng bởi Tim Down:

function getSelectionHtml() { 
    var html = ""; 
    if (typeof window.getSelection != "undefined") { 
     var sel = window.getSelection(); 
     if (sel.rangeCount) { 
      var container = document.createElement("div"); 
      for (var i = 0, len = sel.rangeCount; i < len; ++i) { 
       container.appendChild(sel.getRangeAt(i).cloneContents()); 
      } 
      html = container.innerHTML; 
     } 
    } else if (typeof document.selection != "undefined") { 
     if (document.selection.type == "Text") { 
      html = document.selection.createRange().htmlText; 
     } 
    } 
    return html; 
} 

Khi đã được xác định, bạn có thể gọi lastCharTRL phương pháp bạn đã định nghĩa để kiểm tra xem các ký tự cuối cùng là RTL và hành động phù hợp.

if (lastCharRTL(getSelectionHtml())) 
    $('#pointer').css({top: rects[n].top + 10, left: rects[n].left - 10}).show(); 
else if(backwards) 
    $('#pointer').css({top: rects[0].top + 10, left: rects[0].left - 10}).show(); 
else 
    $('#pointer').css({top: rects[n].top + 10, left: rects[n].right}).show(); 

DEMO