定义javascript变量

Question

我想在ajax函数中定义一些变量，例如 var last_heart ，但它们似乎没有在ajax函数内注册

＆＃13;

＆＃13;

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<script> 
    $(document).ready(function(){
           
		var last_heart;
			
		     $("#watchbtn").click(function(){

		     //var w1 = $(this).val('#watchit');
			     
                              if(last_heart == 1){ //remove watch
			      var arg = "?nav=2";
			      var w2= '<i class="fa fa-heart-o"></i>';
			      var heart = 2;
			      }else{
			      var arg = '';
			      var w2 = '<i class="fa fa-heart"></i>';
			      var heart = 1;
			      }
	        $.ajax({ url: "/ajax.php"+arg, success: function(result){

	document.getElementById('watchit').innerHTML = w2;
		            
		            var val1 = document.getElementById('watchcnt').innerHTML.value;

		            if(val1 == null || val1 == "undefined"){
		               var val = 1;
		            }else{
		            var val = Number(val1) + 1
		            }

		            document.getElementById('watchcnt').innerHTML = val;
		            

	                    last_heart = heart;
                     }});//end ajax
		    });
        });
</script>


<button id="watchbtn" class="btn btn-success btn-small"><span id="watchit"><i class="fa fa-heart-o"></i></span> Watch</button>
<a href="#">Watch <span id="watchcnt" class="badge">0</span></a>

＆＃13;

＆＃13;

＆＃13;

Answer 1

我为你解决了这个问题：

$(document).ready(function () {

    var last_heart = 1;

    $("#watchbtn").click(function () {
     var arg = '';
     var w2 = '';
     if (last_heart == 1) { //remove watch
         arg = "?nav=2";
         w2 = '<i class="fa fa-heart-o"></i>';
         var heart = 2;
     } else {
         arg = '';
         w2 = '<i class="fa fa-heart"></i>';
         var heart = 1;
     }
     $.ajax({
         url: "/ajax.php" + arg,
         success: function (result) {

             document.getElementById('watchit').innerHTML = w2;

             var val1 = document.getElementById('watchcnt').innerHTML.value;

             if (val1 == null || val1 == "undefined") {
                 var val = 1;
             } else {
                 var val = Number(val1) + 1
             }

             document.getElementById('watchcnt').innerHTML = val;


             last_heart = heart;
            }
        }); //end ajax
    });
});

亲自尝试@ http://jsfiddle.net/8n5aj55j/1/

测试Ajax的最简单方法是使用Chrome，打开网络标签，然后选择＆＃34; XHR＆＃34;现在你看到你的Ajax请求标题，正文等。你也看到改变last_heart会发出你想要的不同请求。

Answer 2

尝试：

＆＃13;

＆＃13;

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<script> 
    $(document).ready(function(){
           
		var last_heart = 0;
			
		     $("#watchbtn").click(function(){

		     //var w1 = $(this).val('#watchit');
			     var heart = '';
                  var arg = '';
                   var w2= '';
                              if(last_heart == 1){ //remove watch
			      arg = "?nav=2";
			      w2= '<i class="fa fa-heart-o"></i>';
			      heart = 2;
			      }else{
			      arg = '';
			      w2 = '<i class="fa fa-heart"></i>';
			      heart = 1;
			      }
	        $.ajax({ url: "/ajax.php"+arg, success: function(result){

	        $('#watchit').html(w2);
		            
		            var val1 = $('#watchcnt').text();

		            if(val1 == null || val1 == "undefined"){
		               var val = 1;
		            }else{
		            var val = parseInt(val1) + 1
		            }

		            document.getElementById('watchcnt').innerHTML = val;
		            

	                    last_heart = heart;
                     }});//end ajax
		    });
        });
</script>


<button id="watchbtn" class="btn btn-success btn-small"><span id="watchit"><i class="fa fa-heart-o"></i></span> Watch</button>
<a href="#">Watch <span id="watchcnt" class="badge">0</span></a>

＆＃13;

＆＃13;

＆＃13;