16

別の入力フィールドの値が変更されるたびに、入力フィールドの値を変更したいと考えています。

しばらく試してみましたが、うまく機能しないようです

<input class="span4 input-big" id="dare_price" name="price" size="30" type="text" onChange="updatePrice()" />
<input class="span4 input-big" id="total_price_amount" readonly="readonly" value=""/>​


function updatePrice() {
    var price = $("#dare_price").val();
    var total = (price + 1) * 1.05;
    $("$total_price_amount").val(total);
}​

これがフィドルです。

4

5 に答える 5

13

いくつかのこと。

  1. まず、私があなたなら、jQuery の最新バージョンを使用します。現在1.8です。

  2. また、イベント トリガーとして「keyup」と「change」を使用します。私の意見では、それはより使いやすいです。jQuery を使用してイベントをバインドすることも好きです。http://api.jquery.com/on/を参照してください。

  3. コードにいくつかのエラーがありました。$("$total_price_amount") パーツがエラーをスローしていたことに注意してください

  4. 設定した小数点数だけを表示したい場合は、 を使用します.toFixed()。ただし、これは文字列を返すことに注意してください。

  5. テキスト ボックスからの入力値は typestringであるため、数値計算を行うには、それらを anintまたは aに解析する必要があります。float

これが私の更新されたJSFiddleです

http://jsfiddle.net/DigitalBiscuits/QWSQp/71/

そして、私が実際に使用したコード

$(document).ready(function()
{
    function updatePrice()
    {
        var price = parseFloat($("#dare_price").val());
        var total = (price + 1) * 1.05;
        var total = total.toFixed(2);
        $("#total_price_amount").val(total);
    }
    $(document).on("change, keyup", "#dare_price", updatePrice);
});

onChange="updatePrice()"この部分は不要になったため、HTML から削除したことに注意してください。

これがお役に立てば幸いです。

于 2012-09-05T19:35:01.993 に答える
6 
$("#dare_price").change(function(){
   var total = Number($this).val()) + ...;
   $('#total_price').val(total);
});

プログラムで値を変更する場合は、メソッドを介して値をパイプライン処理する必要があります -

function changePrice(value){
   $('#dare_price').val(value);
   $('#dare_price').trigger('change');
}

このイベント駆動型アプローチのDEMO を更新しました。

于 2012-09-05T19:00:36.517 に答える
2

タイプミスにしか見えない

$("$total_price_amount").val(total);

する必要があります

$("#total_price_amount").val(total);

「#」を使用して ID を取得します

于 2012-09-05T19:00:55.347 に答える
2

安全のためにparseFloat()、価格を設定する必要があります。また、これを行う前に、最初から偶数であることを確認する必要があります。そうでなければ、あなたは得るでしょうNaN

function updatePrice() {
    var price = $("#dare_price").val();
    var total = (parseFloat(price) + 1) * 1.05;
    console.log(total);

    // Other big problem was the $total_price_amount typo that should of had # instead
    $("#total_price_amount").val(total);
}​

jsFiddle デモ

于 2012-09-05T19:01:21.477 に答える
0

これは change イベントの例です。目的に合わせて、keydown や -up などのイベントを使用できます (live メソッドは、実行時に作成される要素に使用されます)。

  $('#first').live("change", (function(){       
            $('#idofinputfield').val('mynewvalue');         
    }))
于 2012-09-05T19:02:01.120 に答える