1

.load()次のようなスクリプトを含む連絡先ページを読み込んでいます。

<script type="text/javascript">

    $('#submit').click(function(e){
        e.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>

連絡先ページを直接ロードすると (つまり に移動するとhttp://example.com/contact-us)、スクリプトは正常に動作しますが、フォームとスクリプトを を使用して DOM にロードすると動作しません.load()。をクリックする#submitと、スクリプトを実行せずにフォームが送信されます。何が起こっているのですか？

ああ、ロード スクリプトは次のようになります。

<script>
$('#top_links a').click(function (e) {
    e.preventDefault();
    var link = $(this).attr('href');
    $('#content').empty();

    $('#content').load(link + ' #content > *');


});
</script>

アップデート：

の問題を指摘してくれた @pointy に感謝し.load()ます。だから今、私は自分のコードを使用するように変更しました$.get:

<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>

問題は同じです。上記の AJAX スクリプトは、ユーザーが送信ボタンをクリックしたときに、フォームの送信または投稿要求の送信を妨げません。ロードされているコンテンツの外側に両方のスクリプトを配置しました$.get

4

2 に答える 2

2

URL の後にセレクターをロードし.load()て使用すると、jQuery はロードされたコンテンツでスクリプトを実行しません。明示的にそれらを取り除き、それらを捨てます。

これを行う主な理由は、読み込まれたページの一部を破棄しているため、選択されたコンテンツ内にある埋め込みスクリプトが、選択されていないページに他の JavaScript がないと機能するかどうかがわからないためだと思います。

編集— 残念ながら、代替コードでも同じ問題が発生します。問題は$(data)、返されたページ HTML をドキュメント フラグメントに変換することです。これは、jQuery の内部で、スクリプトを削除する「clean」と呼ばれる関数を通過します。それらは保存されますが、$(data)関数呼び出しが戻るまでに破棄されます。

サーバーが完全なページを返す必要がないことを確認する作業をサーバーが行う方法を見つけられれば、おそらくはるかにスムーズになるでしょう。とにかく、物事が速くなります。ページの一部のみを使用する場合は、完全なページを出荷しても意味がありません。

于 2012-07-03T23:24:53.790 に答える
0

問題は、送信ボタンが動的に読み込まれるコンテンツであり、live() を使用する必要があったことです。$("#submit").live("click", function(e){})

于 2012-07-04T03:49:13.410 に答える