Mam numer contenteditable div
i muszę znać słowo na obecnym stanowisku. Próbowałem this solution, ale problem polega na tym, że nie rozpoznaje znaków specjalnych, takich jak @
i ~
. Więc jeśli słowo zaczyna się od ~
, jak ~fool
, otrzymuję fool
, natomiast oczekiwałem ~fool
. Tak więc próbowałem zmodyfikować rozwiązanie, biorąc pod uwagę, że jeśli po przesunięciu zaznaczenia z powrotem, napotkany znak nie jest spacją, będę poruszał się do tyłu, dopóki nie napotkam spacji. To by oznaczało początek selekcji. Podobnie też posuwałbym się naprzód, dopóki nie znajdę miejsca, a to oznaczałoby koniec selekcji. Wtedy wybór dałby mi słowo. Aby uzyskać pozycję opiekuna, użyłem this solution. Po połączeniu, mój kod wygląda następująco:Zdobądź słowo zaczynające się od znaków specjalnych pod opieką w contenteditable div
function getCaretPosition(editableDiv) {
var caretPos = 0,
sel, range;
if (window.getSelection) {
sel = window.getSelection();
if (sel.rangeCount) {
range = sel.getRangeAt(0);
if (range.commonAncestorContainer.parentNode == editableDiv) {
caretPos = range.endOffset;
}
}
} else if (document.selection && document.selection.createRange) {
range = document.selection.createRange();
if (range.parentElement() == editableDiv) {
var tempEl = document.createElement("span");
editableDiv.insertBefore(tempEl, editableDiv.firstChild);
var tempRange = range.duplicate();
tempRange.moveToElementText(tempEl);
tempRange.setEndPoint("EndToEnd", range);
caretPos = tempRange.text.length;
}
}
return caretPos;
}
function getCurrentWord() {
var sel, word = "";
if (window.getSelection && (sel = window.getSelection()).modify) {
var selectedRange = sel.getRangeAt(0);
sel.collapseToStart();
sel.modify("move", "backward", "word");
while (sel.toString() != " " && getCaretPosition($("#editor").get(0)) != 0) {
sel.modify("move", "backward", "character");
(sel = window.getSelection()).modify;
}
sel.modify("move", "forward", "character");
sel.modify("extend", "forward", "word");
word = sel.toString();
// Restore selection
sel.removeAllRanges();
sel.addRange(selectedRange);
} else if ((sel = document.selection) && sel.type != "Control") {
var range = sel.createRange();
range.collapse(true);
range.expand("word");
word = range.text;
}
return word;
}
$(function() {
$(document).on('keyup keydown paste cut mouseup',"#editor", function() {
var word = getCurrentWord();
console.log(word);
});
});
To jednak nie działa. To nie jest problem. 1. Problem 2 to, nawet jeśli na obrazie jest obraz, a użytkownik kliknie na obrazku, program obsługi nadal zwraca ostatnie słowo przed obrazem, natomiast oczekuję pustego ciągu. Czy ktoś może mi pomóc rozwiązać te dwa problemy?
Nienawidzę się, że facet, ale to brzmi jak między 2 odpowiedzi masz wszystko, czego potrzebujesz, aby ułożyła roztworu roboczego do swoich potrzeb. Nie musisz zaznaczać żadnej z odpowiedzi, po prostu myśl, że masz wystarczające rozwiązania, aby uzyskać coś działającego dla siebie: P –
Próbuję też sam, nie siedzę leniwie za działającym rozwiązaniem od kogoś innego. – SexyBeast
Przepraszam, nie zamierzałem sugerować, że jesteś leniwy. Chodzi tylko o to, że pomiędzy tymi dwiema odpowiedziami myślę, że odpowiedź czai się. –