Hinzufügen eines target="_blank" mit execCommand 'createlink'
Ich bin versucht, erstellen Sie eine mini-WYSIWYG-editor für ein custom CMS. Es hat die option zum hinzufügen und entfernen von Verknüpfungen. Es fügt links in Ordnung, aber hätte gerne die option zum hinzufügen target="_blank"
auf den hyperlink. Auch, wenn möglich, würde ich mag in der Lage sein, um hinzuzufügen alt=""
und title=""
.
Im moment ist mein code:
function addLink() {
var linkURL = prompt('Enter a URL:', 'http://');
editorWindow.document.execCommand('createlink', false, linkURL);
}
Gesucht um, und kann nicht scheinen, um eine Lösung zu finden. Die meisten Lösungen, die ich gesehen habe sagen, hinzufügen:
function addLink() {
var linkURL = prompt('Enter a URL:', 'http://');
var newLink = editorWindow.document.execCommand('createlink', false, linkURL);
newLink.target = "_blank";
}
Aber das scheint nicht zu funktionieren. Irgendwelche Vorschläge?
- Tun Sie wirklich wollen, verwenden Sie die execCommand-Funktion? Warum nicht erstellen Sie einfach einen neuen link-element und fügen Sie es der dom, oder besser noch, jQuery verwenden? => auch, vergessen Sie nicht, zu entkommen, die url, die der Benutzer eingeben können, um zu verhindern, dass mögliche XSS
- Danke für die Antwort. Nicht genau wissen, wie gehen über diese. Ich weiß, Sie fügen Sie ein neues element erstellen mit
document.createElement('a');
und dann hinzufügensetAttribute('target', '_blank');
. Das einzige, was ich nicht sehe ist, wie man den link zu dem text hervorgehoben worden.
Du musst angemeldet sein, um einen Kommentar abzugeben.
War ich in der Lage, eine Lösung zu finden. Weiß nicht, ob dies der richtige Weg zu gehen, aber es funktioniert. Folgende https://stackoverflow.com/a/5605841/997632, das ist, was ich für mein code:
Nur im Fall, jemand ist auf der Suche-und stößt auf diese...
insertHTML können frustriert, wenn Sie Fett oder Kursiv vor.
Ich benutze folgenden Ansatz:
JS:
Da, es ist keine einfache cross-browser-Lösung, die eine cross-browser Abhilfe könnte sein ein Programm anbringen eines event-handler zu
a
innen-editor:Ich weiß dieser thread ist schon ziemlich alt, aber ich werfe meine 2 Cent, und vielleicht wird jemand findet das nützlich 😉
Ich arbeite gerade an einem WYSIWYG-editor auch, Wie ich fand, der akzeptierte Lösung fällt für mich, wenn ich versuche einen link von einem ausgewählten Bild in FF (die getSelection().getRangeAt(0) gibt das Bild der übergeordneten div-Element und behandelt das Bild, wie es nie war nicht da (so sehe ich es)), hier ist ein schmutziges, aber die Arbeit (und, ich denke, es ist turbo-cross-browser -) Idee, die ich kam mit (jQuery):
Ist es eine gute Idee? Funktioniert wie ein Charme. Und diese Einfachheit ^^
Niemand scheint zu erwähnen, dass wie pro Spezifikationen, die
document
hat in den design-Modus:Dann sollte Folgendes funktionieren: