используя другой метод, чем innerHTML в JS? - PullRequest
0 голосов
/ 28 мая 2011
<div id="content">
    <h1>Redigeringsbara stycken</h1>
    <p class="editable">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

</div>

// JAVASCRIPT

window.onload = function  () {
    /*
    var pElements = document.getElementsByTagName('*');
    for (var i=0; i < pElements.length; i++) {
        if(pElements[i].className == 'editable')
            inPlaceEditor(pElements[i]);
    };
    */
   document.onclick = catchIt;
};

function inPlaceEditor (editableElement) {

}

var editing = false;

if (document.getElementById && document.createElement)
{
   var butt = document.createElement('BUTTON');
    var buttext = document.createTextNode('Ready!');
    butt.appendChild(buttext);
    butt.onclick = saveEdit;
}

function catchIt(e) {
    if (editing) {
          alert("U're still editing!!");
        return;
    }
    if (!document.getElementById || !document.createElement) return;
    if (!e) var obj = window.event.srcElement;
    else var obj = e.target;
    while (obj.nodeType != 1) {
        obj = obj.parentNode;
        alert(obj.nodeType);
    }
    if (obj.tagName == 'textarea' || obj.tagName == 'a') return;
    while (obj.nodeName != 'P' && obj.nodeName != 'HTML')
    {
        obj = obj.parentNode;
        alert(obj.nodeName);
    }
    if (obj.nodeName == 'HTML') {
        // alert ("this is HTML");
        return;
    }
    //other way to grab the text instead of innerHTML-method????
    var targetInnerHtml = obj.innerHTML;
    var textArea= document.createElement('textarea');
    var parentnode = obj.parentNode;
    parentnode.insertBefore(textArea, obj);
    parentnode.insertBefore("<br />", obj);
    parentnode.insertBefore(butt, obj);
    parentnode.removeChild(obj);
    textArea.value = targetInnerHtml ;
    textArea.focus();
    editing = true;
}

function saveEdit() {
    var area = document.getElementsByTagName('textarea')[0];
    var paragraph = document.createElement('P');
    var parentnode = area.parentNode;
    paragraph.innerHTML = area.value;
    parentnode.insertBefore(paragraph, area);
    parentnode.removeChild(area);
    parentnode.removeChild(document.getElementsByTagName('button')[0]);
    editing = false;
}

ПРИВЕТ ГУЛЬРЫ И МАЛЬЧИКИ! Мне интересно, если: 1- есть другой способ получить HTML-текст вместо использования метода innerHtml? для тех, кто работает в Jquery, было бы проще реализовать этот код в Jquery? чтобы линии не были быстрее? Gracias! :)

Ответы [ 2 ]

1 голос
/ 28 мая 2011

Вы можете сделать это просто, если вы можете использовать jQuery.Какое событие вы используете?

Вы можете использовать метод jQuery html () , чтобы получить / установить innerHTML.

Чтобы получить innerHTML

$(obj).html()

Чтобы установить:

$(textArea).value(targetInnerHtml)
0 голосов
/ 28 мая 2011

Кажется, что вы просто хотите текст, поэтому вы можете написать:

var targetText = obj.textContent || obj.innerText;

Более надежная версия:

if (typeof obj.textContent == 'string') {
    targetText = obj.textContent;
} else if (typeof obj.innerText == 'string') {
    targetText = obj.innerText;
}

, которую можно превратить в функцию, чтобы вы моглиможно назвать это вместо того, чтобы писать каждый раз выше.

Другие комментарии:

function catchIt(e) {
editing = false;

  if (editing) {

Как будет редактирование когда-либо быть правдой?

  parentnode.insertBefore(butt, obj);

приклад нигде не объявлен или не инициализирован.

...