2013-12-15 5 views
2

У меня есть редактируемый DIV, который содержит HTML:Как расширить выделение, чтобы включить тег окружения?

"hello "<a href='#'>this is the title</a>" goodbye" 

Если я выбираю только «его является» частью HTML по ссылке, и запустите:

document.execCommand('unlink'); 

Тега разбиваются два ярлыка:

<a href='#'>t</a>"his is"<a href='#'>the title</a> 

Есть ли способ изменить выбор, чтобы развернуть весь тег ссылки, чтобы удалить всю ссылку?

selection = document.getSelection() ? 

UPDATE

Благодаря Габи! Я принял свое решение и изменить его немного расширить прошлое сменяющих жирного и курсивного теги:

var selection = document.getSelection(); // get selection 
var node = selection.anchorNode; // get containing node 


var baseChild = function(parent, last) { 
    var children = parent.childNodes.length; 
    if (children == 0) { 
    return parent; 
    } 
    var child = (last == true) ? children-1 : 0; 

    return baseChild(parent.childNodes(child)); 
} 

var findAndRemove = function(node) { 

    while (node && node.nodeName !== 'A'){ // find closest link - might be self 
    node = node.parentNode; 
    } 

    if (node){ // if link found 
    var range = document.createRange(); //create a new range 
    range.selectNodeContents(node); // set range to content of link 
    selection.addRange(range); // change the selection to the link 
    document.execCommand('unlink'); // unlink it 
    if (node.previousSibling){ 
     findAndRemove(baseChild(node.previousSibling, true)); 
    } 
    if (node.nextSibling){ 
     findAndRemove(baseChild(node.nextSibling, false)); 
    } 
    } 
} 
findAndRemove(node); 

ответ

4

Попробуйте

var selection = document.getSelection(), // get selection 
     node = selection.anchorNode; // get containing node 

    while (node && node.nodeName !== 'A'){ // find closest link - might be self 
    node = node.parentNode; 
    } 

    if (node){ // if link found 
    var range = document.createRange(); //create a new range 
    range.selectNodeContents(node); // set range to content of link 
    selection.addRange(range); // change the selection to the link 
    document.execCommand('unlink'); // unlink it 
    } 

Demo вhttp://codepen.io/gpetrioli/pen/lkrFi

+1

'window.getSelection()' более совместимо, чем 'document.getSelection()', поэтому должно быть предпочтительным, хотя теперь они указаны как псевдонимы, поэтому в современных браузерах это нормально. –

+0

@TimDown спасибо за хедз-ап .. –

-1

попробовать это,

var a = document.getElementsByTagName('a'); 

while(a.length) { 
    var parent = a[ 0 ].parentNode; 
    while(a[ 0 ].firstChild) { 
     parent.insertBefore( a[ 0 ].firstChild, a[ 0 ]); 
    } 
    parent.removeChild(a[ 0 ]); 
} 
+0

хорошо, что очистит все мои теги независимо от того, что выбрано –

Смежные вопросы