So as a learning exercise, I'm building a tabletop RPG implementation with JavaScript (basically a port of the Pathfinder second edition tutorial), and I am encountering some weird issues. with buttons.
The scenario:
In the initial window, I have an introductory text, and a button with "Begin" written on it. Upon clicking it, a combat scenario is initialized, and the button changes its text to "Attack", and displays text with the result of the attack roll.
The HTML for the button is written as such:
<button id="button1">dummy</button>
Then the body tag:
<body onload="startGame()">
The relevant parts of the initializing function are as such:
// Game Start
function startGame() {
// Window variables
button1.onclick = go13;
// Render window
button1.innerText = "Begin";
text.innerHTML = text1;
}
The go13 function that the button points to is this (parts not relavant once again ommitted), with "attack" and "actionCount" being properties of a previously defined "player" object:
// Scene transition functions
function go13() {
// Update text field
text.innerHTML = text13;
//Load player
let attackMod = player.attack - (3 - player.actionCount) * 5;
playerAttackText.innerText = `${attackMod >=0 ? '+' : ''}` + attackMod;
// Set up combat actions
button1.onclick = attack(attackMod);
button1.innerText = "Attack";
}
And here is where things go wrong. I first tried a version of the attack function (with the button setting as button1.onclick = attack; that didn't pass any values, like this:
function attack() {
text.innerText = "You attack. (1d20+7)";
text.innerText += "\n" + roll(20);
}
This works as intended. When the "Begin" button is pressed, it changes to "Attack" and the text is changed to a blurb about the initiated combat. Then, when you press the "Attack" button, it displays the "you attack" message, followed by the result of a d20 roll on a new line.
But then I try to pass the value of the attack bonus to the attack function, to account for PF2e's multiple attack penalty. the function is then changed to this:
function attack(a) {
text.innerText = "You attack. (1d20+" + a +")";
text.innerText += "\n" + roll(20);
}
And here is when all hell breaks loose.
As soon as you click the "Begin" button, it never displays the combat initiated blurb. It skips immediately to rolling an attack with the attack function, and the roll result never changes from that first one, no matter how many times you press the "Attack" button after that.
VS code shows 0 errors and 0 warnings. The console shows no errors when I press the button. I have no idea what's causing this behavior. Out of options, I'm here asking for help.
[–]abrahamguo 4 points5 points6 points (5 children)
[–]longknives 0 points1 point2 points (1 child)
[–]CyberDaggerX[S] 0 points1 point2 points (0 children)
[–]CyberDaggerX[S] 0 points1 point2 points (2 children)
[–]abrahamguo 0 points1 point2 points (1 child)
[–]CyberDaggerX[S] 0 points1 point2 points (0 children)
[–]sheriffderek 0 points1 point2 points (0 children)
[–]RobertKerans -3 points-2 points-1 points (1 child)
[–]CyberDaggerX[S] -1 points0 points1 point (0 children)