Создание ссылок NicEdit не работает в IE 8 и FireFox, если текст не был выделен

Question

У меня проблема с инструментом создания ссылок nicEdit в IE и Firefox.

В общем, я думаю, что проблема связана с execCommand в IE и FireFox. Кажется, документ не обновляется после execCommand выполняет.

Это пример моей проблемы с командой nicEdit create link.

if(!this.ln) {
        var tmp = 'javascript:nicTemp();';
        this.ne.nicCommand("createlink",tmp);
        this.ln = this.findElm('A','href',tmp);
        // set the link text to the title or the url if there is no text selected
        alert(this.ln);
        if (this.ln.innerHTML == tmp) {
            this.ln.innerHTML = this.inputs['title'].value || url;
        };
    }

Код выше вызывается, когда текст не выделен, Chrome возвращает 'javascript:nicTemp()' для alert(this.ln)в то время как IE 8 и Firefox возвращаются 'undefined'поэтому следующая строка после alert сталкивается с ошибкой в ​​IE и Firefox.

похоже на то findElem не могу найти только что созданную ссылку nicCommand который в свою очередь вызывает execCommand

У меня были похожие проблемы, когда я пытался найти и изменить теги, созданные с execCommandкажется, что дом не обновляется, чтобы включить их.

Я прав? Как я могу решить эту проблему? как я могу заставить документ обновляться....

пожалуйста помоги

Answer 1

Мой трюк для nicEdit, в ситуации, когда текст не выделен, состоит в том, чтобы вставить заголовок, заданный с помощью формы "Добавить ссылку", в документ и выделить его, тогда остальной код будет работать так же, как и при выделении текста.

Я использовал функцию pasteHtmlAtCaret, описанную в следующей ссылке, чтобы вставить заголовок

Вставьте HTML в каретку в contenteditable div

this.removePane();
var url = this.inputs.href.value;
var selected = getSelected();
var B= 'javascript:nicTemp()';
if (selected == '')
{
    var B = url;
    pasteHtmlAtCaret(this.inputs['title'].value || url,true);
}                   
if(!this.ln){
    this.inputs.title.value;this.ne.nicCommand("createlink",B);
    this.ln=this.findElm("A","href",B)
}

getSelected также простая функция, как показано ниже

function getSelected()
{
    if (document.selection)
        return document.selection.createRange().text;
    else
        return window.getSelection();
}

Answer 2

Ахмад, просто используйте этот вариант функции submit, чтобы избежать проблемы "insert/edit" со ссылкой, у меня это сработало:

submit : function(e) {
    var url = this.inputs['href'].value;
    if(url == "http://" || url == "") {
        alert("Introduce una URL valida para crear el Link.");
        return false;
    }
    this.removePane();

    if(!this.ln) {
        //**************** YOUR CHANGE WITH A BIT OF VARIATION **************
        var selected = this.getSelected();
        var tmp = 'javascript:void(0)';
        if (selected == '') {
            tmp = url;
            this.pasteHtmlAtCaret(this.inputs['title'].value || tmp, true);
        }
        //**************** END OF YOUR CHANGE WITH A BIT OF VARIATION **************

        this.ne.nicCommand("createlink",tmp);
        this.ln = this.findElm('A','href',tmp);

        // set the link text to the title or the url if there is no text selected
        if (this.ln.innerHTML == tmp) {
            this.ln.innerHTML = this.inputs['title'].value || url;
        };
    }

    if(this.ln) {
        var oldTitle = this.ln.title;
        this.ln.setAttributes({
            href: this.inputs['href'].value,
            title: this.inputs['title'].value,
            target: '_blank'
        });
        // set the link text to the title or the url if the old text was the old title
        if (this.ln.innerHTML == oldTitle) {
            this.ln.innerHTML = this.inputs['title'].value || this.inputs['href'].value;
        };
    }
}

Answer 3

    this.removePane();
            var url = this.inputs['href'].value;
            var selected = getSelected();
            var isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
            var tmp = "";
            if(isChrome == true){
                tmp=url;
            }
            else{tmp='javascript:nicTemp()'}
            if (selected == '' && isChrome == false)
            {
                pasteHtmlAtCaret(this.inputs['title'].value || url,true);
            }
            if (!this.ln) {
                //var tmp = this.inputs['title'].value == "" ? this.inputs['href'].value : this.inputs['title'].value;
                this.ne.nicCommand("createlink", tmp);
                this.ln = this.findElm('A', 'href', tmp);
            }


    function getSelected()
    {
        if (document.selection)
            return document.selection.createRange().text;
        else
            return window.getSelection();
    }

    function pasteHtmlAtCaret(html) {
        var sel, range;
        if (window.getSelection) {
            // IE9 and non-IE
            sel = window.getSelection();
            if (sel.getRangeAt && sel.rangeCount) {
                range = sel.getRangeAt(0);
                range.deleteContents();

                // Range.createContextualFragment() would be useful here but is
                // non-standard and not supported in all browsers (IE9, for one)
                var el = document.createElement("div");
//create a link format
                el.innerHTML = '<a href="'+ html +'" title="" target="_blank">'+ html +'</a>';
                var frag = document.createDocumentFragment(), node, lastNode;
                while ( (node = el.firstChild) ) {
                    lastNode = frag.appendChild(node);
                }
                range.insertNode(frag);

                // Preserve the selection
                if (lastNode) {
                    range = range.cloneRange();
                    range.setStartAfter(lastNode);
                    range.collapse(true);
                    sel.removeAllRanges();
                    sel.addRange(range);
                }
            }
        } else if (document.selection && document.selection.type != "Control") {
            // IE < 9
            document.selection.createRange().pasteHTML(html);
        }
    }