1

ユーザーがテンキーの + ボタンを押したときに 0 から 100 まで 1 ステップをカウントするカウンターを作成します。

これの目的は、店舗のカウンターを作成することです (現在の顧客数をディスプレイに表示しており、これを Web ベースにしたいと考えています)。だから私はjQueryを使用しており、現在の番号をMySQLデータベースにも保存したいと考えています。

どうすればこれを行うことができますか?フォームを使用したくないのですが、必要に応じて使用します。いくつかの解決策を試しましたが、実際に使用できるものはありません。問題は、jQuery について十分に理解していないことです。したがって、正しい方向へのいくつかのポインタがあればいいでしょう。

こんな流れでお願いします。

データベースからフェッチする数値を含む要素がありますが、これまでのところ非常にうまくいっているので、間違いなく自分でそれを行うことができます。ただし、ユーザーがテンキーで + を押すと、この値を 1 ずつ増やします。次に、スクリプトでこの新しい値をデータベースに保存し、データベースから新しい値を取得して、要素に再度表示します。

私が言ったように、これについていくつかの指針をいただければ幸いです。おそらく私はそれを考えすぎています。

ちなみに私はPHPを使っています。

4

2 に答える 2

1

したがって、クリックされている「+」ボタンを処理し、AJAX呼び出しを行う必要があります。何かのようなもの:

http://jsfiddle.net/QE3xd/1/

HTML:

<input type="text" id="current" readonly="readonly" value="2" />
<input type="button" id="increaser" value="+" />

Javascript:

$(document).ready(function () {
    $("#increaser").on("click", add);
});

function add() {
    // Make AJAX call to PHP method (where DB operation is done)

    $.ajax({
        url: "/echo/json/",
        cache: false,
        data: {"increment_by": 1},  // This line may be unnecessary, as you could assume it increases the value by 1 every time (but using this could make it customizable
        dataType: "json",
        success: function (data) {
            // Should return data in format: {"new_current": 4}
            //$("#current").val(data.new_current);
            // ^^ the real line
            $("#current").val(+$("#current").val()+1);
            // ^^ just to simulate the new number being returned
        },
        error: function () {
            console.log("there was an error");
        }
    });
}
于 2012-10-12T15:02:46.217 に答える
0

あなたが説明しているのは、典型的なMVVMの問題です。相互作用するボタンと表示要素を備えたユーザー インターフェイス。

この種の問題を、 knockoutjsライブラリと jquery を組み合わせて解決する良い経験がありました。チュートリアルでは、あなたと同じように counter を使用した例があります。

その他の 2 つの要件 (テンキーの検出と投稿) は、keypress プラグインと jquery で簡単に解決できます。$.post

于 2012-10-12T15:04:05.687 に答える