如何使用jquery添加或減去html元素的數字

Question

我試圖從span標籤內的數字中添加/減去數字。這是一個複選框依賴。這是我想了jQuery：

//If checked 
var $newprice = $("#totalprice").val() + 299;    
$("#totalprice").text($newprice); 

//If NOT checked 
var $newprice = $("#totalprice").val() - 299;    
$("#totalprice").text($newprice); 

如果我選中該複選框，它增加了299，但選中變化數-299。

Answer 1

對於跨度，您需要使用text()方法來獲取內容不val()。在這兩種情況下，val()返回一個空字符串。在第一種情況下，只會發生字符串連接。在第二種情況下這將是"" - 231導致-231，其中空字符串充當0

所以，你可以使用text()有回調持有指數和舊值，解析舊值和增加或減少的價值和回報它用於更新。

//If checked 
var $newprice = $("#totalprice").text(function(i,v){ 
    return parseInt(v,10) + 299;    
}); 
//If NOT checked 
var $newprice = $("#totalprice").text(function(i,v){ 
    return parseInt(v,10) - 299;    
}); 

Answer 2

你必須這樣做在你的複選框的更改事件：

$(':checkbox').change(function() { 
 
    if (this.checked) { 
 
    //If checked 
 
    var $newprice = +$("#totalprice").text() + 299; 
 
    $("#totalprice").text($newprice); 
 
    } else { 
 
    //If NOT checked 
 
    var $newprice = +$("#totalprice").text() - 299; 
 
    $("#totalprice").text($newprice); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p> 
 
    <input type='checkbox'> 
 
    <span id='totalprice'>0</span> 
 
</p>

+$("#totalprice").text()領先+會變成文本數量。