1

給与計算機を作成しようとしていますが、時給と時間数を入力して計算を押すと、合計テーブルで取得できるのは未定義です。これが私のJavaScriptです:

var $ = function (id) {
return document.getElementById(id); 
}

function updateTotal () {

var rate;
var hours = parseFloat( $("numHours").value);
var regularHours;
var overtime;
var doubletime;

    //begin determine hourly rate 
    function checkJob () {
    if ($('job').value == 'job0') {
    rate = 0;
    }
    if ($('job').value == 'job1') {
    rate = 12;
    }
    if ($('job').value == 'job2') {
    rate = 10;
    }
    if ($('job').value == 'job3') {
    rate = 11;
    }
    }

    //calculate hours breakdown
    function checkHours () {
    if (hours.value <= 40) {
    regularHours = hours.value;
    overtime = 0;
    doubletime = 0;
    }

    if (hours.value < 60) {
    regularHours = 40;
    overtime = hours.value-40;
    doubletime=0;
    }

    if (hours.value >=60) {
    regularHours = 40;
    overtime = 20;
    doubletime = hours.value-60;
    }
    }

    checkJob();
    checkHours();

    var salary = (regularHours * rate) + (overtime * (rate * 1.5)) + (doubletime * (rate * 2))



    //display amounts
    $('regularHours').innerHTML = regularHours;
    $('overtime').innerHTML = overtime;
    $('doubletime').innerHTML = doubletime;
    $('salary').innerHTML = "$ " + salary;
}

私は何かばかげたものを見逃していると確信していますが、私はこのコードを何日も見つめていて、何が間違っているのか理解できません。見てくれてありがとう!

4

1 に答える 1

1

編集

問題のあるコードは次のとおりです。

hours.value

それに関する問題は、それhoursがすでに数であり、数がvalueそれに利用できる方法を持っていないということです。のすべてのインスタンスを変更hours.valueするhoursと、問題が解決し、計算結果が適切に出力されます。

このデモを参照してください:http://jsfiddle.net/gLthv/


問題は、jqueryセレクターを実装する方法です。代わりに使用するかdocument.getElementById()、IDを選択するには、ID名の前に#

$("#id")

しかし、それは問題の最初の部分にすぎません。次の部分は、jqueryを使用しているが、dom要素を期待していることです。jqueryオブジェクトのラップを解除するには、jqueryオブジェクトを使用[0]して、含まれているdom要素にアクセスできるようにする必要があります。

$("#id")[0]

これらの変更を行うと、反映された計算を確認できるはずです。たとえば、$('job').value実際にそうする必要があります。$('#job')[0].valueまたは、jqueryの実装に固執する場合は、を使用$('#job').val()して値を取得できます。

これと同様に、jqueryの実装にアクセスすることもできますinnerHTML。それはこれを変えるでしょう$('overtime').innerHTML = overtime$('#overtime').html(overtime)

于 2013-02-17T21:06:45.593 に答える