返回'undefined'的多层javascript函数

Question

这可能很简单，只是缺少我应该如何返回这些数据。

var sumInputs = function (input) { 
    var reloadData = function() { 
    var sum = 0; 
    $(input).each(function() { 
     sum += Number($(this).val()); 
    }); 
    return sum; 
    }; 

    $(window).ready(function() {     
    var changeOn = $(input); 
    changeOn.on('change', function() { 
     var data = reloadData(); 
    }); 
    changeOn.trigger('change'); 
    }); 
}; 

var sum = sumInputs('.feature'); 
console.log(sum); 

现在我只是得到undefined作为我的结果。这是我的jsfiddle：http://jsfiddle.net/bk97qc4L/

感谢您的帮助。

Answer 1

你sumInputs是一个函数，它在一个参数，并且没有返回。因此sum评估为undefined。

在sumInputs里面，你声明了一个变量reloadData（作为一个函数），并且每当窗口准备就绪时就让一个事件绑定运行。你没有指定任何返回值，甚至没有执行函数reloadData。

我怀疑这是你想要的：http://jsfiddle.net/bk97qc4L/1/

Answer 2

$(document).ready(function() {     
 
    function sumInputs(input, output) { 
 
     var $input = $(input); 
 
     
 
     function reloadData() { 
 
     var sum = 0; 
 
     $(input).each(function() { 
 
      sum += Number($(this).val()); 
 
     }); 
 
     return sum; 
 
     }; 
 
    
 
     $input.on('change', function() { 
 
      $('#output').val(reloadData()); 
 
     }); 
 
    }; 
 
    
 
    sumInputs('input.feature','#output'); 
 
    $('input.feature').change(); // for first time output 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr><td><input type="text" class="feature" value="10" /></td></tr> 
 
    <tr><td><input type="text" class="feature" value="10" /></td></tr> 
 
    <tr><td><input type="text" class="feature" value="10" /></td></tr> 
 
    <tr><td><input type="text" class="feature" value="10" /></td></tr> 
 
</table> 
 

 
<label for="output">Output:</label> 
 
<input type="text" id="output" />