总计值属性检查框

这个jQuery代码试图总所有class = valid的input元素被检查的value。它是如何完成的？ THX总计值属性检查框

Template.checkbox.events({ 
    'click .valid':() => { 
    $("input.valid:checked").each(function() { 
     console.log(this); //total them here 
    }) 
    } 
});

<template name="checkbox"> 
    <div class="checkbox-container"> 
    <div class="checkbox"> 
     <label class="check"> 
     <input class="valid" type="checkbox" name={{name}} value={{value}} checked={{checked}}>{{label}} 
     <input class="count" type="checkbox" name={{name}} value={{value}} checked={{checked}}> 
     </label> 
    </div> 
    </div> 
</template>

来源

2017-03-06 Fred J.

好吧，你需要点击处理程序中的变量简单地作为一个总和，那么，在里面。每个（）函数，将$（this）.val（）添加到sum变量。猜测。我不知道流星，所以我不能肯定地说，但我就是这样。 – Snowmonkey

['reduce']（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce）是良好的用于在循环和。 –

你有jsfiddle看吗？ –

var total = null; 
Template.checkbox.events({ 
    'click .valid':() => { 
    $("input.valid:checked").each(function() { 
     total += parseFloat(this.value); 
    }) 
    } 
}); 
console.log(total);

来源

2017-03-06 21:38:38

在Meteor的Template事件处理程序之外创建一个变量并不是一个好主意。如果你需要它在事件助手的范围之外，它应该存储在一个'Session'中。 –

@SterlingArcher我不知道流星东西，使我的解释上的错误，但是这一个变量需要设置为按住接听和值需要被添加到无论这个变量是正确的总体思路。 –

你的选择是好，现在你只需要增加一个值的每个循环。您可以使用.map把所有的值到一个数组，然后reduce它：

var total = $("input.valid:checked").map(function() { 
    return this.value; 
}).get().reduce(function(t, number) { 
    return t += parseInt(number, 10); 
}, 0);

来源

2017-03-06 21:39:20 tymeJV

这很好，但它可以与Lambdas更ES6'd！ –

@SterlingArcher - 我可以LAMBDA了'reduce'电话 - 但jQuery的'each'可能不应该，会乱用'this'价值 – tymeJV

我敢肯定有来处理这一个更大气的方式，但我鄙视流星所以我会同意 –

总计值属性检查框

回答

相关问题