2013-04-29 24 views
8

Tôi đang cố gắng thêm hai giá trị của các hộp cảnh báo nhưng tôi vẫn nhận được một hộp cảnh báo trống. Tôi không biết tại sao.jQuery thêm 2 số từ các trường nhập

$(document).ready(function(){ 
    var a = $("#a").val(); 
    var b = $("#b").val(); 
    $("submit").on("click", function(){ 
     var sum = a + b; 
     alert(sum);   
    }) 
}) 

Trả lời

25

Thêm chuỗi concatenates chúng:

> "1" + "1" 
"11" 

Bạn cần phải phân tích chúng thành số đầu tiên:

var a = parseInt($('#a').val(), 10); 
var b = parseInt($('#b').val(), 10); 

Ngoài ra, bạn có để có được các giá trị từ bên trong handler nhấp chuột:

$("submit").on("click", function() { 
    var a = parseInt($('#a').val(), 10); 
    var b = parseInt($('#b').val(), 10); 

Nếu không, bạn đang sử dụng các giá trị của các hộp văn bản từ khi tải trang.

+0

đầu tiên u nên thêm thư viện ur cho jquery, vì vậy u cần phải tải về nó. và sau đó thêm dòng này vào trong đầu tiên .......

-2

Ok để mã của bạn thực sự hoạt động nhưng những gì bạn cần làm là thay thế a và b trong hàm nhấp chuột của bạn bằng ký hiệu jquery mà bạn đã sử dụng trước khi nhấp. Điều này sẽ đảm bảo bạn có giá trị chính xác và cập nhật nhất. để thay đổi chức năng nhấp chuột của bạn để điều này nên làm việc:

$("submit").on("click", function(){ 
    var sum = $("#a").val().match(/\d+/) + $("#b").val().match(/\d+/); 
    alert(sum);   
}) 

hoặc inlined tới:

$("submit").on("click", function(){ 
    alert($("#a").val().match(/\d+/) + $("#b").val().match(/\d+/));   
}) 
-2

Mã này hoạt động, bạn có thể so sánh nó với bạn?

<!DOCTYPE html> 
<html lang="en-US"> 
<head> 
    <title>HTML Tutorial</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <meta charset="windows-1252"> 
<script> 

$(document).ready(function(){ 
    var a = $("#a").val(); 
    var b = $("#b").val(); 
    $("#submit").on("click", function(){ 
     var sum = a + b; 
     alert(sum);   
    }) 
}) 
</script> 
</head> 
<body> 
    <input type="text" id="a" name="option"> 
    <input type="text" id="b" name="task"> 
<input id="submit" type="button" value="press me"> 

</body> 

</html> 
3
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#btnadd').on('click', function() { 
      var n1 = parseInt($('#txtn1').val()); 
      var n2 = parseInt($('#txtn2').val()); 
      var r = n1 + n2; 
      alert("sum of 2 No= " + r); 
      return false; 
     }); 
     $('#btnclear').on('click', function() { 
      $('#txtn1').val(''); 
      $('#txtn2').val(''); 
      $('#txtn1').focus(); 
      return false; 
     }); 
    }); 
</script> 
2

Có hai cách mà bạn có thể thêm hai số trong jQuery

cách đầu tiên:

var x = parseInt(a) + parseInt(b); 
alert(x); 

Thứ hai Way:

var x = parseInt(a+2); 
alert(x); 

Bây giờ đến câu hỏi của bạn

var a = parseInt($("#a").val()); 
var b = parseInt($("#b").val()); 
alert(a+b); 
0

Sử dụng mã này để thêm hai số bằng cách sử dụng jquery

<!DOCTYPE html> 
    <html lang="en-US"> 
    <head> 
     <title>HTML Tutorial</title> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <meta charset="windows-1252"> 
    <script> 

    $(document).ready(function(){ 
     $("#submit").on("click", function(){ 
     var a = parseInt($('#a').val()); 
     var b = parseInt($('#b').val()); 
      var sum = a + b; 
      alert(sum); 
     }) 
    }) 
    </script> 
    </head> 
    <body> 
     <input type="text" id="a" name="option"> 
     <input type="text" id="b" name="task"> 
    <input id="submit" type="button" value="press me"> 

    </body> 

    </html> 
Các vấn đề liên quan