追加機能

私は個人用の小さな店舗としてウェブサイトを作成しています。ここでの主な質問は、どのようにすべての機能を追加するための機能をコーディングするのでしょうか？追加機能

プリンタ、モニタ、モデム、または他の使い慣れたデバイスを含むさまざまなタイプの周辺デバイス用の6つのチェックボックス。基本的なコンピュータシステムの価格を$ 500.00とし、ユーザーのチェックに基づいて適切な価格を追加します。
モニター299.99 プリンタ129.99 スピーカー49.99 CDRW 159.99 スキャナは129.99 モデム私はスキャナを追加する場合は49.99

、私の合計は$ 629.99となります。モデムとモニタを追加すると、合計は$ 849.98になります。この宿題は

<html> 
<head> 
<title>Problem 9</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<script type="text/javascript"> 
// Program name: Problem 9 
// Purpose: Program 9 
// Author: Opack 
// Date last modified: 2-13-12 
$(function() { 
    function calculateCost() { 
    var ret = 500; 
    var $selected = $('input:checked', $peripherals); 

    $selected.each(function() { 
     ret += parseFloat($(this).attr('alt')); 
    }); 

    return ret.toFixed(2); 
    } 

    function setCost() { 
    $total.text(calculateCost()); 
    } 

    var $peripherals = $('#peripherals'); 
    var $total = $('#total'); 
    $('input[type="checkbox"]', $peripherals).on('change', setCost); 

    setCost(); 

}); 

</script> 
<style> 
    h1 { 
    font-size: large; 
    } 
</style> 
</head> 
<body bgcolor="yellow"> 
    <h1>What peripherals do you want to add?</h1> 
    <form id="peripherals"> 
     <input type="checkbox" name="Monitor" value="Monitor" alt="299.99">Monitor<br> 
     <input type="checkbox" name="Printer" value="Printer" alt="129.99">Printer<br> 
     <input type="checkbox" name="Speakers" value="Speakers" alt="49.99">Speakers<br> 
     <input type="checkbox" name="CDRW" value="CDRW" alt="159.99">CDRW<br> 
     <input type="checkbox" name="Scanner" value="Scanner" alt="129.99">Scanner<br> 
     <input type="checkbox" name="Modem" value="Modem" alt="49.99">Modem<br> 
     <label for="Cost">Total</label><input type="text" name="Cost" /> 
    </form> 
</body> 

</body> 
</html>

出典

2012-02-11 Opack Odore

追加：ケースjsbinで

jQueryのコードは、バスト...

$(function() { function calculateCost() { var ret = 500; var $selected = $('input:checked', $peripherals); $selected.each(function() { ret += parseFloat($(this).attr('alt')); }); return ret.toFixed(2); } function setCost() { $total.attr('value', calculateCost()); } var $peripherals = $('#peripherals'); var $total = $('input[name="Cost"]'); $('input[type="checkbox"]', $peripherals).on('change', setCost); setCost(); });

、関連するHTMLを行きますか？ –

変更されたOPの詳細説明。 –

は、ここに私のattemptです。私はjQueryを使い、自動的にコストを更新しました。私はコスト情報をチェックボックスの "alt"属性に添付しました。これは他の方法でも可能です。あなたの目的に合わせて微調整してください。何の

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<meta charset=utf-8 /> 
<title>Cost Demo/title> 
<style> 
    h1 { 
    font-size: large; 
    } 
</style> 
</head> 
<body> 
    <h1>What peripherals do you want to add?</h1> 
    <form id="peripherals"> 
     <input type="checkbox" name="Monitor" value="Monitor" alt="299.99">Monitor<br> 
     <input type="checkbox" name="Printer" value="Printer" alt="129.99">Printer<br> 
     <input type="checkbox" name="Speakers" value="Speakers" alt="49.99">Speakers<br> 
     <input type="checkbox" name="CDRW" value="CDRW" alt="159.99">CDRW<br> 
     <input type="checkbox" name="Scanner" value="Scanner" alt="129.99">Scanner<br> 
     <input type="checkbox" name="Modem" value="Modem" alt="49.99">Modem<br> 
     <label for="Cost">Total</label><input type="text" name="Cost" /> 
    </form> 
</body> 
</html>

出典

2012-02-11 08:48:33

基本料金がありませんでした。数学は今は大丈夫でしょう。 –

それを修正して少し修正しました。チェックボックスをクリックすると、合計コストに追加されていないようです。：S –

あなたのコードをどこかで共有できますか？私はここでいくつかの論理を欠いているかもしれません。総コストは、選択されたコストに基づいています。この計算は、チェックボックスが変更されるたびに実行されます。 –

です：私はこの機能を追加する方法がわからないんだと

は、ここに私の現在の進行状況があり、私はまだあまりにも多くのJSコードを追加していませんか？

function calculation(a,b) 
{ 
    return a + b; 
}

SOURCE

W3Schools: Javascript Operators
W3Schools: Javascript Functions

出典

2012-02-11 07:34:43

いいえ、OPで説明したように、個人的に使用します。 –

答えて

関連する問題