phiên bản ngắn:Remove ký tự x cuối cùng trước khi vị trí carret
Tôi có một div contenteditable. Tôi muốn loại bỏ các ký tự x cuối cùng trước khi carret postion.
dài phiên bản:
Nếu ai đó một [
trong div contenteditable có sẽ xuất hiện một danh sách autosuggest, lấp đầy bởi một cuộc gọi ajax. Đây là allready làm việc. Tôi cũng có thể chèn đề xuất đã chọn ở vị trí carret và thêm ]
. Tuy nhiên, các ký tự, đã được người dùng nhập, sẽ bị xóa trước khi thêm đề xuất. Giá đỡ [
không chỉ là "trigger-char" mà còn là phần tử định dạng giống như markdown.
Ví dụ:
văn bản trong div ("|" là viết tắt của carret): Lorem ipsum| sit lorem ipsum dolor
người dùng hiện loại [do
để bắt đầu tự động gợi ý: Lorem ipsum [do| sit lorem ipsum dolor
dolor
được đề xuất và chèn sau carret: Lorem ipsum [do|dolor sit lorem ipsum dolor
Vấn đề: các ký tự gõ allready do
cần được loại bỏ trước khi chèn đề nghị
hành vi mong muốn: Lorem ipsum [dolor] sit lorem ipsum dolor
Solutions đã thử:
Insert text at cursor in a content editable div - làm việc nhưng tôi không thể loại bỏ các ký tự cuối cùng https://developer.mozilla.org/en-US/docs/Web/API/Selection - cố gắng để có được một số ý tưởng từ MDN , nhưng không biết cách thay đổi nội dung của textNode của lựa chọn
Mã:
Giải nén chuỗi giữa cuối cùng "[" và carret để tìm kiếm gợi ý trong DB:
var sel = window.getSelection();
var cords = getCaretCoords();
var searchQuery = extractSearchQuery(sel.anchorNode.data, sel.anchorOffset, "[");
function extractSearchQuery(searchString, caretPos, triggerString) {
//cut everything after carret
searchString = searchString.slice(searchString.lastIndexOf(triggerString) + 1, caretPos);
return searchString;
}
Chèn gợi ý sau carret:
function insertTextAtCursor(text) {
var sel, range, html;
if (window.getSelection) {
sel = window.getSelection();
if (sel.getRangeAt && sel.rangeCount) {
range = sel.getRangeAt(0);
range.deleteContents();
var newTextNode = document.createTextNode(text);
range.insertNode(newTextNode);
}
} else if (document.selection && document.selection.createRange) {
document.selection.createRange().text = text;
}
}
Chào mừng bạn đến với SO. Vui lòng bao gồm các giải pháp đã thử, tại sao chúng không hoạt động và kết quả mong đợi. Điều đó thực sự sẽ giúp chúng tôi tìm ra vấn đề với mã của bạn. Cảm ơn! –
Đối với sự hiểu biết của tôi, nếu ai đó gõ 'ips', và sau đó là" [", bạn muốn autosuggest' ipsum' và sau đó thay thế 'ips [' by 'ipsum'? Nếu vậy, bạn dường như đã biết rằng bạn phải tìm một cái gì đó bắt đầu với 'ips', vì vậy bạn chỉ có thể thay thế chuỗi' ips ['by' ipsum', phải không? Vì vậy, một cái gì đó như 'divtext.replace (lookup +" [", found);', trong đó 'divtext' là nội dung của div có thể chỉnh sửa của bạn,' lookup' là chuỗi tra cứu để 'ips' trong ví dụ này và' found' là chuỗi được tìm thấy bởi tính năng tự động đề xuất, 'ipsum' trong trường hợp này. – rolfv1
Vui lòng thêm mã hiện tại của bạn vào câu hỏi. Tôi nghi ngờ bất cứ ai thực hiện điều này từ 0 cho bạn. –