2 つのスクリプトを実行しようとしています。1 つは ajax を使用してページ コンテンツを読み込むためのもので、もう 1 つは ajax を使用して連絡先フォームを送信するためのものです。
ページ コンテンツを読み込む:
<script>
$('#top_links a').click(function (e) {
e.preventDefault();
var link = $(this).attr('href');
$('#content').empty();
$.get(link, { },
function(data) {
$('#content').replaceWith($(data).find("#content"));
}
)
});
</script>
フォームを送信:
<script type="text/javascript">
$('#submit').click(function(event){
event.preventDefault();
var name = $('#name').val();
var email = $('#email').val();
var message = $('#message').val();
$.post("<?php echo bloginfo( 'template_directory' ) . '/inc/mailit.php';?>",
{
name: name,
email: email,
message: message
},
function(data) {
var n = data.indexOf('<span class="success_message">');
if (n !== 0) {
$('#message_box_1').empty().append(data);
} else {
$('#contact_form').empty().append(data);
}
}
);
});
</script>
どちらのスクリプトもフッターにあり、動的に読み込まれるコンテンツには含まれません。ajaxを使用してコンテンツをロードせずに連絡先ページに直接アクセスすると、フォームコードは完全に機能します。しかし、ajax を使用してフォームを読み込むと、送信スクリプトが機能しなくなります。
これは実際には、以前に投稿した質問のフォローアップの質問です。少し考えた結果、私が以前に受け取った回答が正確であると 100% 確信できるわけではありません。答えは、フォーム送信コードが読み込まれたコンテンツの一部であるという仮定に依存していましたが、コンテンツの変更の影響を受けないすべてのコードをフッターに配置したため、そうではありません。回答のチェックを外すことができないので、再投稿する必要がありました。