jQueryの関数を呼び出せない。

Question

インプットに個数を入力すると、個数×100円/個の金額を<span>タグ内に表示するjQueryを書いています。

<input type="number" id="ammount" min="0" style="text-align:right" val=1>個<br>
<span id="price"></span>円

現状記述しているコードは下記のコードです。

#個数×100円/個の金額を計算し、表示する関数（①）
function price(){
    ammount = $("input#ammount").val();
    price = ammount * 100;
    $('span#price').text(price);
};

#個数変更時にprice関数を起動するためのコード（②）
var timer = false;
$("input#ammount").change(function(){
    if (timer !== false){
        clearTimeout(timer);
    }
    timer = setTimeout(function(){
        alert("change"); #setTimeoutがうまく動いているかを試すためのテスト
        price(); #ここでprice関数を実行したい
    }, 1000);
});

#画面表示時にprice関数を起動するためのコード（③）
$(document).ready(function(){
    squareMeter();
});

①は、金額を計算し<span>タグに表示するための関数です。ここは問題無いと思います。

②は、inputで個数が変更された時に、price関数を起動するための記述です。
個数は、<input type="number">に入力してもらうため、1個ずつ増やしていくたびにいちいちprice関数が起動することなく、変更し終えて1秒後にようやくprice関数が起動するための工夫をしています。

③は、inputのデフォルト値が1なので、表示時に、1×100を計算して表示するための記述です。

問題は、③をコメントアウトすれば②も問題なく動くのですが、③があると②が動きません。
試しに、③がある状態でinputの数値を変えると、alert("change")までは動きます。
そのため、③があると、price関数を呼び出すことができないのだと思います。

なお、②があっても、③は問題なく起動します。

原因が掴めず、困っています。
お分かりの方、ご教示頂ければ幸いです。
よろしくお願いいたします。

Answer 1

price = ammount * 100;の部分で関数名に仕様しているpriceに値を入れてしまっているのが原因だと思います。（なので③をコメントアウトした状態でも2回目以降は動作しないと思います。）

var price = ammount * 100;または別の変数名に変えて見て下さい。

Comments

[退会済みユーザー]

ご回答頂き、ありがとうございました。
そのとおりでした。
私の変数の理解に誤りがありました。