Использование .innerHTML из функции onClick

-2

У меня возникли проблемы с использованием .innerHTML в функции javascript, вызванной нажатием кнопки. Для короткой мерцающей секунды я вижу, что функция вызывается, а текст изменен, но затем текст возвращается.Использование .innerHTML из функции onClick

<html> 
<head> 
</head> 

<body> 

<form> 
    <input type="submit" value="Change the Text" onClick="change()"> 
</form> 

<div id="ToBeChanged"> Hello, World </div> 

<script> 
function change(){ 
    document.getElementById("ToBeChanged").innerHTML = "New Text"; 
}; 
</script> 

</body> 
</html>

Конечно, если бы я просто использовать .innerHTML вне функции, она меняет текст без каких-либо проблем и не вернуться к старому тексту. Есть ли способ использовать .innerHTML для изменения текста из функции onClick? Или есть другой способ, которым я должен выполнить эту задачу?

источник

2015-05-01 RMoore

Что случилось с кодом вы показываете? – jfriend00

работает отлично здесь http://jsfiddle.net/mjc6fq97/2/ –

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

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

<input type="button" value="Change the Text" onClick="change()">

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

источник

2015-05-01 02:04:40 jfriend00

Спасибо - да, это все, что требовалось. Изменив его с «отправить» на «кнопочный» тип, исправлена проблема. – RMoore

Текст возвращается, потому что у вас есть input type=submit, который в основном вызывает функцию javascript, а затем отправляет форму, которая перезагружает страницу.

Вам необходимо предотвратить подачу формы. Что-то вроде:

onClick="change(); return false;"

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

источник

2015-05-01 02:04:51 Icarus

А, я понимаю! Благодарю. Мне действительно не нужна форма для отправки в этот момент, поэтому просто переключить тип на «кнопку» было все, что было необходимо. – RMoore

Использование .innerHTML из функции onClick

ответ

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