我正在尝试创建一种非常简单的方法来更改提交的值，该变量使用简单的饼图库来决定饼图的百分比。
以下是易于使用的代码。
browserify通过将数据百分比设置为0
，上面的饼图为0％<span class="chart" data-percent="0">
<span class="percent"></span>
</span>
<input id="value1" type="text" />
<span> + </span>
<input id="value2" type="text" />
<span class="btn js_update" onclick="output();">Update chart</span>
<p id="result"> </p>
以上构建饼图 - 但是我需要一个简单的输入字段并提交以更改变量<script src="../dist/easypiechart.js"></script>
<script>
function output(){
var value1 = document.getElementById('value1').value;
var value2 = document.getElementById('value2').value;
document.getElementById('result').innerHTML = parseInt(value1) + parseInt(value2);
}
document.addEventListener('DOMContentLoaded', function() {
var chart = window.chart = new EasyPieChart(document.querySelector('span'), {
easing: 'easeOutElastic',
delay: 3000,
barColor: 'purple',
trackColor: 'pink',
scaleColor: false,
lineWidth: 20,
trackWidth: 20,
lineCap: 'butt',
onStep: function(from, to, percent) {
this.el.children[0].innerHTML = Math.round(percent);
}
});
document.querySelector('.js_update').addEventListener('click', function(e) {
chart.update(Math.floor(val2));
});
});
</script>
的值我尝试使用返回值但不允许这样做，我尝试使用jquery来写出价值但仍不确定，但我确信这是一件简单的事情？
答案 0 :(得分：1)
您可以在按下按钮时阅读input中的值：
document.querySelector('.js_update').addEventListener('click', function(e) {
var val1 = parseInt(document.querySelector('#value1').value);
var val2 = parseInt(document.querySelector('#value2').value);
chart.update(Math.floor(val2));
});
在上面的代码中，只使用了val2，但您了解原则：
output和上面的匿名函数，由addEventListener链接input中的文本，并将其转换为数字。input 您有output的类似代码，但请注意，未定义执行顺序。可能是output在上述步骤之前或之后执行。
对两个任务只使用一个事件处理程序更有意义：执行添加和更新图表。因此，要么将所有代码放入output（图表业务），要么删除output并将附加内容放入已传递给addEventListener的函数中。