1

特定のチェックボックスがオンになっている場合、フォームを送信する前に送信ボタンをクリックすると、テキストボックス内の合計金額に 50.00 が追加されるようにする方法を見つけようとしています。実際、チェックボックスがオンになったらすぐに更新を行う方がよいでしょう。

これが私がこれまでに試したことです：

<!DOCTYPE html>
<html>
<head>
<script>
function toggle(){
var indoorCamping = 50.00;
var total = 0.00;
if(document.getElementByName('fifty').is(':checked')){
total = (indoorCamping + document.getElementsByName('Amount').value);
document.getElementsByName('Amount').value = total;
}

else{
return;
}
}
</script>
</head>
<body>

<p>Click the button to trigger a function.</p>

<input type="checkbox" name="fifty" value="indoor"/>

<label for="Amount">Amount <span class="req">*</span> <span 

id="constraint-300-label"></span></label><br />
                <input type="text" class="cat_textbox" id="Amount" name="Amount" />

<p id="demo"></p>

<button onclick="toggle()">Click me</button>

</body>
</html>
4

2 に答える 2

1

text-input の値は、最初は常にテキスト (文字列) です。この値は、追加する前に明示的に数値に変換する必要があります。そうしないと、テキストが連結されます。したがって、「20」は「5020」になります。

mohkhan のコードを借りる:

<script>
function toggle(checkbox){
    var indoorCamping = 50.00;
    var total = 0.00;
    if(checkbox.checked){
        total = (indoorCamping + document.getElementById('Amount').value * 1);
        document.getElementById('Amount').value = total;
    }
}
</script>

「20」を数値に変換する1つの方法である1を掛けました。Number(x)、parseInt(x)およびparseFloat(x)他の方法です。

ただし、オブジェクト変数を使用することをお勧めしますamt。

<script>
function toggle(checkbox) {
    var indoorCamping = 50.00;
    var total = 0.00;
    var amt = null;
    if (checkbox.checked) {
        amt = document.getElementById('Amount');
        total = (indoorCamping + amt.value * 1);
        amt.value = total;
    }
}
</script>
于 2013-07-28T01:37:01.270 に答える
0

次に、チェックボックスにクリックイベントを追加します。このような...

<input type="checkbox" name="fifty" value="indoor" onclick="toggle(this);"/>

そして、あなたのスクリプトで...

<script>
function toggle(checkbox){
var indoorCamping = 50.00;
var total = 0.00;
if(checkbox.checked){
    total = (indoorCamping + document.getElementById('Amount').value);
    document.getElementById('Amount').value = total;
}
}
</script>
于 2013-07-28T00:42:45.043 に答える