Изменение текста элемента не работает

Это всегда кажется, что проблема, и я не понимаю, почему я пытаюсь изменить элемент p текст, используя свой идентификатор, элемент p id="para1" внутри PostEditor.html:Изменение текста элемента не работает

elementID Я хочу изменить это para1 в following html:

 <!DOCTYPE html> 
    <html> 
    <head> 
      <title>Editor</title> 
      <link href="styles/editor.css" rel="stylesheet" type="text/css" media="screen" /> 
      <script src="scripts/mainScript.js"> </script> 
    </head> 
    <body> 
      <!-- Input fields --> 
      <div class="center"> 
      <form id=caller method="post"> 
        <p id="para1" class="text"><Strong>Post your message</Strong></p> 
        <textarea id="textEditor" rows="16" cols="34" name="content"></textarea> 
      <input type="submit" onclick="urlLoader('caller','posthandler.php')" value="Post"> 
      </form> 
      </div> 
      <!-- end Input fields --> 

     </body> 
     </html>

следующая функция выдается щелчком по ссылке внутри index.html и отображения страницы, которую вы видите выше, и затем предполагается изменить его содержание: Из index.html я выдаю f помазание от ссылки:

<a onclick="postEditing()"> Edit</a>

Эта линия проблема следующая функция:

function postEditing() 
{ 
    var result = window.open('PostEditor.html', 'newwindow', 'width=350,' + 'height=350'); 
    result.document.getElementById("para1").innerHTML = "11111111111"; 
    result.document.getElementById("para1").innerText = "11111111111"; 
    result.document.getElementById("para1").value = "11111111111"; 
}

Как вы можете видеть, что я попробовал три метода. Я никогда не пойму, в чем разница между ними, но я пробовал все три, и никто не работал!

источник

2013-07-03 Canttouchit

Я не уверен, чтобы понять ... вы пытаетесь обновить содержание HTML-страницы PostEditor.html со страницы index.html, который только что открыл PostEditor.html в новом окне? –

Это работает для меня: [jsbin] (http://jsbin.com/oqezot/1/edit) –

postEditing вызывается из index.html – Canttouchit

Это потому, что вы ищете документ окна, который показывает index.html, а не документ только что открытого окна. попробуйте следующее:

... 
    var editorWindow = window.open('PostEditor.html', 'newwindow', 'width=350,' + 'height=350'); 
    editorWindow.document.getElementById("para1").innerHTML = "11111111111"; 
    ...

EDIT: сейчас я вижу проблему: в функции, которую вы пытаетесь получить доступ к свойству параметра element, но не передать значение для него , Таким образом, это закончится ошибкой, потому что доступный объект - undefinded!

Так у вас есть три варианта, чтобы получить его работы:

тест параметр (всегда хорошая идея): var ID = null; if(element) ID = element.id;
передать значение: <a onclick="postEditing(this)"> Edit</a>
удалить строку var ID = element.id;

РЕШЕНИЕ: (TESTED)
Я не мог сказать, почему, но index.html нашел para1 и может успешно установить новый текст. Но каким-то образом новое окно снова инициализирует старое значение.

Таким образом, вы должны сделать изменение в обработчике запуске в onLoad:

index.html:

<html> 
<head> 
<script> 
function postEditing() { 
    var result = window.open('PostEditor.html', 'newwindow', 'width=350,' + 'height=350'); 
    result.onload = function() { 
     result.document.getElementById("para1").innerHTML = "11111111111"; 
    } 
} 
</script> 
</head> 
<body> 
<a onclick="postEditing()"> Edit</a> 
</body> 
</html>

PostEditor.html:

<!DOCTYPE html> 
<html> 
<head> 
     <title>Editor</title> 
     <link href="styles/editor.css" rel="stylesheet" type="text/css" media="screen" /> 
     <script src="scripts/mainScript.js"> </script> 
</head> 
<body> 
     <!-- Input fields --> 
     <div class="center"> 
     <form id=caller method="post"> 
       <p id="para1" class="text"><Strong>Post your message</Strong></p> 
       <textarea id="textEditor" rows="16" cols="34" name="content"></textarea> 
     <input type="submit" onclick="urlLoader('caller','posthandler.php')" value="Post"> 
     </form> 
     </div> 
     <!-- end Input fields --> 

    </body> 
    </html>

источник

2013-07-03 14:30:16

Ударьте меня на несколько секунд. Тем не менее: http://www.w3schools.com/jsref/met_win_open.asp для справки. – havarc

Не работает: ((((((( – Canttouchit

затем попробуйте одно из других свойств (innerText/value). Поскольку я работаю с jQuery, я забыл, как это сделать без него;) –

Я совершенно уверен, вам нужно будет запросить результат возврата окна вызова.открыть так:

function postEditing(element) 
{ 
    var ID = element.id; 
    var result = window.open('PostEditor.html', 'newwindow', 'width=350,' + 'height=350'); 
    result.getElementById("para1").innerHTML = "11111111111"; 
    result.getElementById("para1").innerText = "11111111111"; 
    result.getElementById("para1").value = "11111111111"; 
}

[Непроверенные хотя]

источник

2013-07-03 14:34:21 Stokedout

испытал и не работал ни – Canttouchit

Ваш тип кнопки отправить, который размещает форму. Объект изменяется в DOM, только после запуска сценария DOM перезагружается обратно в исходное состояние. Попробуйте изменить тип кнопки на «кнопку», и вы должны соответствующим образом увидеть изменение элемента P.

Редактировать: Вот HTML, который я использовал для определения вышеизложенного. Удержание кнопки как «submit» заставил меня увидеть изменение текста, а затем поменять его назад. HTML ниже должен содержать текст на месте. НТН!

<!DOCTYPE html> 
<html> 
<head> 
     <title>Editor</title> 

     <script> 
     function postEditing(element) 
    { 

     document.getElementById('para1').innerHTML = "asdafs"; 

    } 
     </script> 
</head> 
<body> 
     <!-- Input fields --> 
     <div class="center"> 
     <form id=caller method="post"> 
       <p id="para1" class="text"><Strong>Post your message</Strong></p> 
       <textarea id="textEditor" rows="16" cols="34" name="content"></textarea> 
     <input type="button" onclick="postEditing('caller')" value="Post"> 
     </form> 
     </div> 
     <!-- end Input fields --> 

    </body> 
    </html>

источник

2013-07-03 14:37:37 ewitkows

Я сделал то, что все, что я вижу, - это отображение страницы за 0,1 мс 1111111111, а затем исходное название перескакивает назад – Canttouchit

Я удалил подачу формы ввода, и все оставленное осталось только в пара-1, и оно все еще не работает: ( – Canttouchit

Любопытно, что вы использовали инструменты отладки (F12 на IE \ Chrome или Firebug в FireFox) и исследовали объект para1. Является ли это «найденным» в вашем GetElementById, и когда вы переходите через скрипт, вы видите, что свойство get set? – ewitkows

Изменение текста элемента не работает

ответ

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