Вызов функции оповещения с помощью кнопки, но без использования onclick

Что я пытаюсь сделать, это вызвать мою функцию, когда кто-то нажимает на мою кнопку. Тем не менее, я знаю, что это может быть сделано сВызов функции оповещения с помощью кнопки, но без использования onclick

<button onclick="myFuntion()>

Но я хочу, чтобы пропустить этот шаг, я не хочу функцию в моих кнопках, я слышал, что его плохое программирование.

Однако, как выглядит мой файл.

<!DOCTYPE html> 
<html> 

<head> 
<meta charset="UTF-8"> 
<script type="text/javacript" src="javascript.js"> </script> 
<title> Javascript </title> 

<script> 

function testFunction(){ 
document.getElementById("test").onclick = Hello; 
} 
function Hello(){ 
    alert("Hello"); 
} 
</script> 
</head> 

<body> 
<button type="button" id="test" <!-- I know i can use onclick="testFunction()" here but i dont wanna !-->> Click me </button> 

</body> 

</html>

Так как же оно не всплывающие окна с коробкой «Hello» всякий раз, когда я нажать на кнопку, то, что я сделал не так?

источник

2016-09-23 phil_sw

Таким образом, вы не хотите, чтобы прикрепить функцию к событию щелчка, и вы спрашиваете, почему он не выполняет функцию при ее нажатии ? Это событие click * для *. Не совсем ясно, в чем проблема. – David

Ну, вы никогда не называете testFunction нигде, поэтому событие click не добавляется к кнопке. – epascarello

Вопрос: Почему не использовать onclick, который предназначен для этого? – andreaem

Вы должны позвонить своему testFunction после того, как тело HTML загружено так, что оно фактически создает привязку.

То есть, в конце файла, вы могли бы сделать что-то вроде:

... 
<script> 
    testFunction() 
</script> 
</body> 
...

Если вы бежите, что связывание код в head скрипте button элемент не будет существовать еще — что почему это должно быть в конце.

JavaScript-библиотеки, такие как jQuery, делают это более элегантным, предоставляя крючок ready, где один код вызывается после полной загрузки страницы, без необходимости использовать код внизу страницы.

Полный пример с script в конце (смешения, Stack Отрывки не показать его вам в порядке, они на самом деле находятся в фрагменте кода, даже если он не похож на него, сценарий в конце здесь):

// Scoping function to avoid creating unnecessary globals 
 
(function() { 
 
    // The click handler 
 
    function Hello() { 
 
    alert("Hello"); 
 
    } 
 

 
    // Hooking it up -- you *can* do it like you did: 
 
    //document.getElementById("test").onclick = Hello; 
 
    // ...but the modern way is to use addEventListener, 
 
    // which allows for more than one handler: 
 
    document.getElementById("test").addEventListener(
 
    "click", Hello, false 
 
); 
 
})();

<button type="button" id="test">Click me</button>

источник

2016-09-23 16:00:17 jsbueno

Или, по сути, переместите весь код сценария в этот элемент 'script' в конце. –

Хммм ... .Как, я вижу. Но я также пробовал использовать window.onload = Hello; Это не сработало. Так что единственный способ сделать это - вызвать функцию внизу тела? –

'window.onload = Hello;' <- это вызов функции предупреждения, а не той, которая связывает событие click .... – epascarello

-1

Просто запустите строку в testFunction всегда. Как видно здесь: https://jsfiddle.net/arugco4b/

источник

2016-09-23 16:02:15 Maettel

window.onload=testFunction; 
 
function testFunction(){ 
 
document.getElementById("test").onclick = Hello; 
 
} 
 
function Hello(){ 
 
    alert("Hello"); 
 
}

источник

2016-09-23 16:17:05 jsquerylover

вам нужно загрузить эту функцию при загрузке окна. – jsquerylover

Вызов функции оповещения с помощью кнопки, но без использования onclick

ответ

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