2

私のphpは、最後にechoで各製品を作成します

<form name="addToCartForm">
<input type="hidden" id="inputid" value="'.$id.'"/>
<input type="submit" id="submitbutton" value="Add to cart"/>
</form>

ウェブサイトでは通常、10 個の製品が動的に作成されます

だから私はphpによって表示される各製品に対して同じクラスまたはIDを持つ10個のボタンを持っています

Web サイトを更新せずに、post (jquery) でデータを cart.php ファイルに送信する関数のアイデア。$_POST で製品の適切な ID を送信して、cart.php が追加されたものを認識できるようにする必要があります。

そして、なぜ私が追加したのか

$(document).ready(function(e) {
    $('#submitbutton').click(function(e) {
        var pos = $('#inputid').val();
        alert(pos);
        return false;
    });
});

最初のボタンだけを警告するように機能しています カートに追加 すべてではありません

私はjqueryが初めてです:)助けてください

4

2 に答える 2

2

AJAX 機能を探しているようです。幸いなことに、jQuery には AJAX 呼び出し用の機能があり、http://api.jquery.com/jQuery.ajax/で説明されています。

次に、次のようなコードを記述できます。

$(document).ready(function() {
    $('#submitbutton').click(function() {
        var pos = $('#inputid').val();
        $.ajax({
            url: "cart.php",
            type: "POST",
            data: {itemID: pos},
            success: function(data) {
                // Do stuff when the AJAX call returns
            }
        });
    });
});

ただし、これには欠点があります。同じページに複数の送信ボタンを配置する場合、それらすべてに同じ ID を使用することはできません。次のように、すべてのフィールドにクラスを与えることをお勧めします。

<form name="addToCartForm">
    <input type="hidden" class="inputid" value="'.$id.'"/>
    <input type="submit" class="submitbutton" value="Add to cart"/>
 </form>

最終的な Javascript コードは次のようになります。

$(document).ready(function() {
    $('.submitbutton').click(function() {
        var pos = $(this).parent().find('.inputid').val();
        $.ajax({
            url: "cart.php",
            type: "POST",
            data: {itemID: pos},
            success: function(data) {
                // Do stuff when the AJAX call returns
            }
        });
    });
});
于 2012-11-04T04:20:28.367 に答える
1

同じの要素を複数持つことはできませんid。classこのようなものを追加してみてください、

<form name="addToCartForm">
  <input type="hidden" id="inputid_1" class="inputid" value="'.$id.'"/>
  <input type="submit" id="submitbutton_1" class="submitbutton" value="Add to cart"/>
</form>

JSコードは、

$(document).ready(function(e) {
   $('.submitbutton').click(function(e) {
    var pos = $(this).parent().find('.inputid').val();
    alert(pos);
    //Do your AJAX call here to send data to server.
    return false;
  });​
});

デモ： http： //jsfiddle.net/meqY5/1/

于 2012-11-04T04:15:21.637 に答える