Để làm điều này, hãy sử dụng click() cùng với parseInt().
Ví dụ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div id="add">10</div>
<div id="sequenceValue"></div>
<button id="addSequenceOf10">addValue10EachTimePressMe</button>
<script>
addValue = 0;
$("#addSequenceOf10").click(function() {
var actualValue = parseInt($("#add").html());
addValue = addValue + actualValue;
$("#sequenceValue").html(addValue);
});
</script>
</body>
</html>
Để chạy chương trình trên, chỉ cần lưu tên tệp anyName.html (index.html) và nhấp chuột phải vào tệp và chọn tùy chọn open with live server trong trình soạn thảo VS Code.
Kết quả
Chương trình sẽ cho ra kết quả sau:
Bây giờ, nhấn nút bạn sẽ nhận được 10 sau đó 20 30 40...N; như trong kết quả dưới đây:
Sau khi nhấp thêm một lần, ảnh chụp như sau.
Chương trình sẽ cho ra kết quả sau:
