-1

これはかなり簡単な問題のはずですが、解決方法がわからず、やろうとしていることに対する適切な答えが見つかりませんでした。

非常に簡単に言えば、文字列と 2 つのラジオ ボタンを含むテキストを含む html ファイルがあります。だから、このようなもの：

    <html>
    <head>
      <title>Some title</title>
      <script src="jquery.js"></script>
    </head>
    <body>

      <div id="main">
         <p> 10 GB </p>
      </div>

      <div class="radioButtons" style="width: 100%">
        <p><input type="radio" name="radioLessGB" value="Less" align="absmiddle"/> I want less gigabytes(-3GB) </p>
            <p><input type="radio" name="radioMoreGB" value="More" align="absmiddle"/> I want more gigabytes (+5GB)</p>
      </div>
   </body>
   </html>

選択したラジオボタンに応じて、テキストの値 (「10 GB」など) を更新する方法が必要です。特に、ユーザーが最初のラジオ ボタンを選択すると、上記の文字列の整数値はすぐに 3 だけ減少し(つまり、"10 GB" - 3 = "7 GB")、ユーザーが 2 番目のラジオ ボタンを選択すると、整数値に 5 を加算する必要があります (つまり、「10 GB」 + 5 = 「15 GB」)。

これを行うには、文字列「10 GB」を解析して整数値を取得し、選択したラジオボタンに応じて加算または減算する必要があると思います。次に、文字列を結果で更新します。ユーザーにある種の「送信」ボタンをクリックさせたくありません。ユーザーがラジオボタンを切り替えるときに、番号の更新を「オンザフライ」で行う必要があります。

これはjQueryでできると思いますが、方法がわかりません。簡単な解決策のサンプル コードを使って、経験豊富な人が助けてくれませんか?!?

ありがとう！！

4

3 に答える 3

1

ここでは、完全なコードの回答は提供しません。役立つポインタだけを示します。

  1. 文字列を解析して計算を実行しないでください。数値 (または少なくとも数値文字列) を使用してください。の値を10特別なdata-xxx属性の中に入れます。後でこれらのデータにアクセスするには$(el).data('xxx'):

    <div id="main" data-value="10">

  2. <input>要素が「デルタ」値を保持するために同じことを-3行い+5ます.val()。

  3. いずれかのラジオ ボタンがクリックされた場合 ( を使用してイベントを検出.on('change', fn))、選択されたデルタ値を 内の値に追加します#main。

  4. を使用して合計のフォーマットされた値を表示します.text(sum + ' GB')

于 2013-01-24T14:21:41.890 に答える
0

jQuery は、このかなり簡単なタスクを達成する手段の 1 つです。#main div を分離する必要があります。次に、jQuery を使用してその現在の値を取得し、ラジオ ボタンの onClick (または jQuery: で) を使用して計算を行います。radio.click(function()オプションの値を input タグ内に配置することをお勧めします。

チェックアウト：jqueryの簡単な数学

于 2013-01-24T14:15:32.040 に答える