QA@IT
«質問へ戻る

質問を投稿

Ajaxによってloadされたボタンに対するクリックイベントについて

Ajaxでphpファイルからボタンをロードし、ロード後に、そのボタンのidを指定して、クリックイベントを実施したいのですが、反応しません。
理由と解決策について教えて頂けませんでしょうか?

【読み込み元(index.html)】

<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN' 'http://www.w3.org/TR/html4/strict.dtd'>
<html>
<head>
<meta charset="utf-8">
<script src="jquery-2.0.2.js"></script>

<script type="text/javascript">


$(function(){
 $('#input_form').load("hello.php");
 $('#confirm_button').on("click",sayhello);

 function sayhello(){
   alert('hello');
 }

});


</script>

</head>
<body>

<section id="input_form">
</section>

</body>
</html>

【読み込み先(hello.php)】

<?php

echo '<input type="button" id="confirm_button" value="ボタン" />';

?>
Ajaxでphpファイルからボタンをロードし、ロード後に、そのボタンのidを指定して、クリックイベントを実施したいのですが、反応しません。
理由と解決策について教えて頂けませんでしょうか?

【読み込み元(index.html)】
```
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN' 'http://www.w3.org/TR/html4/strict.dtd'>
<html>
<head>
<meta charset="utf-8">
<script src="jquery-2.0.2.js"></script>

<script type="text/javascript">


$(function(){
 $('#input_form').load("hello.php");
 $('#confirm_button').on("click",sayhello);

 function sayhello(){
   alert('hello');
 }

});


</script>
    
</head>
<body>

<section id="input_form">
</section>

</body>
</html>
```

【読み込み先(hello.php)】
```
<?php

echo '<input type="button" id="confirm_button" value="ボタン" />';

?>
```