0

私はjqueryとAJAXにまったく慣れていません.5〜6時間懸命に努力し、解決策を探した後、私は助けを求めています.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0jquery.min.js"></script>
<script type="text/javascript">
    $(function() {
        $(".submit").live('click',(function() {

            var data = $("this").serialize();
            var arr = $("input[name='productinfo[]']:checked").map(function() {
                return this.value;
            }).get();
            if(arr=='')
            {
                $('.success').hide();
                $('.error').show();
            }
            else
            {
                $.ajax({
                    data: $.post('install_product.php', {productvars: arr}),
                    type: "POST",
                    success: function(){
                        $(".productinfo").attr('checked', false);
                        $('.success').show();
                        $('.error').hide();
                    }
                });
            }
            return false;
        }));
    });
</script>

HTML+PHPコードは、

$json = file_get_contents(feed address);
$products = json_decode($json);
foreach(products as product){
    // define various $productvars as a string
    <input type="checkbox" class="productvars" name="productinfo[]" value="<?php echo $productvars; ?>" />
}
<input type="submit" class="submit" value="Install Product" />

<span class="error" style="display:none"><font color="red">No product selected.</font></span>
<span class="success" style="display:none"><font color="green">product successfully added to database.</font></span>

フィードから製品情報を取得しているため、ページを更新したくないため、AJAX ポスト メソッドを使用しています。上記のコード「install_product.php」ページを使用すると、文字列が適切に処理され、適切に機能します。

私が直面している問題は、最初にチェックボックスをオンにして製品をインストールしたときに完全に正常に動作することですが、最初の投稿の後、「動作する場合と動作しない場合があります」. 新しいリストはフィードから取得されるため、最初の投稿はすべて完璧です。その後、インストール ボタンを何度もクリックする必要があります。

さまざまなブラウザーでコードをテストしましたが、同じ問題が発生しました。何が問題なのですか？（ローカルホストではなくライブホストでコードをテストしています）

4

2 に答える 2

1

$.liveは非推奨です$.on()。代わりに使用することを検討してください。

一度実行した後に実行されていない関数はどれですか? $.live?

また、次のようにする必要があります。

var data = $(this).serialize();

いいえ

var data = $("this").serialize();

あなたの例では、スコープではなく、「this」という明示的なタグを探しています。

アップデート

$(function () {
    $(".submit")
        .live('click', function(event) {

        var data = $(this).serialize();

        var arr = $("input[name='productinfo[]']:checked")
            .map(function () {
            return this.value;
        })
            .get();
        if (arr == '') {
            $('.success')
                .hide();
            $('.error')
                .show();
        } else {
            $.ajax({
                data: $.post('install_product.php', {
                    productvars: arr
                }),
                type: "POST",
                success: function () {
                    $(".productinfo")
                        .attr('checked', false);
                    $('.success')
                        .show();
                    $('.error')
                        .hide();
                }
            });
        }

        event.preventDefault();

    });
});
于 2012-09-26T06:44:19.007 に答える
0

arr で値が欠落していてエラーが表示されている可能性がありますか、それとも呼び出しを行っているが返されていないか、まったく呼び出しに到達していませんか? console.log を実行してデバッグに対処し、firefox / chrome で問題を確認して、問題の内容と場所を確認します。

于 2012-09-26T06:43:59.257 に答える