Totalling multiple rpg dice rolls using jQuery

Viewed 73

I am attempting to do my first project: a simple rpg dice rolling app. I'm using a plus/minus spinner to increase/decrease the number of dice rolled. I've managed to code a result for the total result for one die, but I am unsure as to how to get totals of multiple dice.

Here's what I've got so far for a d6:

HTML

<div class="qty mt-5">
  <span class="minus bg-dark" id="minus_2">-</span>
  <input type="number" id="count_2" class="count" name="qty" value="1" />
  <span class="plus bg-dark" id="plus_2">+</span>
</div>
<div id="dice-roller-d6">
  <div id="randomnumber2" name="randomnumber2"></div>
  <button type="Roll" id="d6" value="random number">Roll</button>
</div>
<div id="d4-generated-number" class="result">RESULT</div>

JS

$('#dice-roller-d6').on('click', () => {
  const result = Math.floor(Math.random() * 6) + 1;
  document.getElementById('d6-generated-number').innerHTML = result;
});
$('#plus_2').on('click', () => {
  const currentValue = $('#count_2').val();
  $('#count_2').val(parseInt(currentValue) + 1);
});

Should I use a conditional for multiple dice results? Any help/suggestions would be greatly appreciated! Thank you!

0 Answers
Related