从 jQuery 函数传递增加/减少的数据？

Question

我创建了这个 jQuery 代码，通过点击按钮 "Next" 它会增加 8 个数字（8,16,32...），如果你点击按钮 "Previous" 它将数字减 8（因此，如果您输入 Next 两次，数字将为 16；如果您按 Previous，数字将为 8）。

我必须通过两个函数传递这个thata。我的代码中的问题是没有传递数据？知道为什么吗？

这是我的代码：

var clicks = 0; 
$(function(){

    $("#btn2").click(function(){ 
      clicks=clicks+8; 
    });

    $("#btn1").click(function(){ 
        clicks = clicks <= 0 ? clicks : clicks - 8; 
    });

    var test = test2(clicks);

});

var test2 = function(test3){
    return test3;
}

$(function(test3){

    $('#result').html(test3);

});

我还创建了 jsFiddle：http://jsfiddle.net/jtw05ff0/1/

非常感谢您的帮助

Answer 1

没有数据被传递，因为您没有在点击时执行函数。

在下面的代码片段中查看我的答案。

$(document).ready(function() {

  var clicks = 0;

  var test2 = function(data) {
      // Do something
      return data;
    }
  
  // Chain your jQuery calls! :)
  $("#btn2").mouseenter(function() {
      $(this).fadeTo('fast', 1);
    })
    .mouseleave(function() {
      $(this).fadeTo('fast', 0.5);
    })
    .click(function() {
      clicks = clicks + 8;
      var test = test2(clicks);
      $('#result').html(test);
    });

  $("#btn1").mouseenter(function() {
      $(this).fadeTo('fast', 1);
    })
    .mouseleave(function() {
      $(this).fadeTo('fast', 0.5);
    })
    .click(function() {
      clicks = clicks <= 0 ? clicks : clicks - 8;
      var test = test2(clicks);
      $('#result').html(test);
    });

  $('#result').html(test2(clicks));

});

.btn {
  float: left;
  padding: 10px 20px;
  border-right: 1px #fff solid;
  color: #fff;
  text-decoration: none;
  background-color: #ccc;
  opacity: 0.5;
  border-radius: 5px;
  cursor: pointer
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div><a class="btn" id="btn1">Previous</a>
</div>
<div><a class="btn" id="btn2">Next</a>
</div>
<br/>
<br/>
<br/>
<div id="result"></div>

从 jQuery 函数传递增加/减少的数据？

Passing increased / decreased data from jQuery functions?

jquery

function