edit: The CODE tag isn't working for me, so I removed all my comments which were making it even harder to read. Hi all. New member here. I'm a college student majoring in web development who just took my first html/javascript class last semester. I wrote a simple program to keep in practice between semesters which sort of works. The purpose of the program is to assist slightly in playing the board game Tide of Iron. In that game, players units attack each other using various numbers of dice which require various numbers(and up) to score hits. Defending units get varying numbers of dice to block, with successes canceling attacker hits. This program can be used by a player to enter the number of attack dice, number needed for a hit, and number of defending dice (which always succeed on 5+). The player next decides whether the program will generate 100 attacks or 1000. The program runs the same attack 100 or 1000 times and displays the average number of successful attacks. The program is just a simple statistical tool for my own use. I don't think I'm violating any copyrights, and I'm certainly not making any money from it. I haven't learned HTML forms yet, which is why the program doesn't use one. The program starts with some typical values already entered, which the user can change. The block number can't be changed as it's a fixed value in the game. Anyhow, rather than waiting for the user to click a button, the program runs through both options on program load. It gives the average after 100 attacks, then 1000, then fails to work after that. Firebug doesn't seem to be helping. The program "works", so I don't see any error codes when I try to debug. <CODE><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- Filename: rolldice.htm .......... --> <title>Battle Results Averager</title> </head> <body> <script type="text/javascript"> var $ = function(id) { return document.getElementById(id); } function dice_roll() { return Math.floor(Math.random() * 6) + 1; } function attack() { var hits = 0; var blocks = 0; var a_roll = parseInt($("aRoll").value); for(a = parseInt($("aDice").value); a > 0; a--) { if(dice_roll() >= a_roll) { hits++; } } for(d = parseInt($("dDice").value); d > 0; d--) { if(dice_roll() >= 5) { blocks++; } } hits -= blocks; if(hits < 0) { hits = 0; } return hits; } function roll_variable_attacks(attacks) { var hits = 0; for(n = attacks; n > 0; n--) { hits += attack(); } alert("There were an average of " + hits/attacks + " over " + attacks + " attacks"); } window.onload = function () { $("aDice").focus(); $("roll_100").onclick = roll_variable_attacks(100); $("roll_1000").onclick = roll_variable_attacks(1000); } </script> <div id="form"> <h3>Battle Results Averager</h3> <p> Enter the number of attack dice, number of defense dice, and the number needed to hit by the attacker. The attackers hit number must be 4+, 5+, or 6+. The defence dice always succeed on 5+ </p> <label for="aDice">                Attack Dice:</label> <input type="text" id="aDice" value="8"/><br /> <label for="aRoll">Attacker to hit number:</label> <input type="text" id="aRoll" value="5" /><br /> <label for="dDice">             Defense Dice:</label> <input type="text" id="dDice" value="4"/><br /> <label for="dRoll">Defender to hit number:</label> <input type="text" id="aRoll" value="5" disabled="disabled" /><br /> <label>  </label> <input type="button" id="roll_100" value="100 Attacks" /><br /><br /> <label>  </label> <input type="button" id="roll_1000" value="1000 Attacks" /> </div> </body> </html></CODE>
i am really not exactly sure what you are trying to get from this ( WAY too much math ! ) but try this code. you had the function initiallizing on load , so i put them on click on the 2 buttons, and just changed those functions slightly. i am curious as too if this is what you want or not. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- Filename: rolldice.htm .......... --> <title>Battle Results Averager</title> </head> <body> <script type="text/javascript"> var $ = function(id) { return document.getElementById(id); } function dice_roll() { return Math.floor(Math.random() * 6) + 1; } function attack() { var hits = 0; var blocks = 0; var a_roll = parseInt($("aRoll").value); for(a = parseInt($("aDice").value); a > 0; a--) { if(dice_roll() >= a_roll) { hits++; } } for(d = parseInt($("dDice").value); d > 0; d--) { if(dice_roll() >= 5) { blocks++; } } hits -= blocks; if(hits < 0) { hits = 0; } return hits; } function roll_variable_attacks(attacks) { var hits = 0; for(n = attacks; n > 0; n--) { hits += attack(); } alert("There were an average of " + hits/attacks + " over " + attacks + " attacks"); } //window.onload = function () //{ function onehundred(){ $("aDice").focus(); roll_variable_attacks(100); //$("roll_100").onclick = roll_variable_attacks(100); } function onethousand(){ $("aDice").focus(); roll_variable_attacks(1000); //$("roll_1000").onclick = roll_variable_attacks(1000); } //} </script> <div id="form"> <h3>Battle Results Averager</h3> <p> Enter the number of attack dice, number of defense dice, and the number needed to hit by the attacker. The attackers hit number must be 4+, 5+, or 6+. The defence dice always succeed on 5+ </p> <label for="aDice">                Attack Dice:</label> <input type="text" id="aDice" value="8"/><br /> <label for="aRoll">Attacker to hit number:</label> <input type="text" id="aRoll" value="5" /><br /> <label for="dDice">             Defense Dice:</label> <input type="text" id="dDice" value="4"/><br /> <label for="dRoll">Defender to hit number:</label> <input type="text" id="aRoll" value="5" disabled="disabled" /><br /> <label>  </label> <input type="button" id="roll_100" value="100 Attacks" onclick="onehundred()"/><br /><br /> <label>  </label> <input type="button" id="roll_1000" value="1000 Attacks" onclick="onethousand()" /> </div> </body> </html> Code (markup):
use your code within [] rathen than <> [ code ]//code within[ /code ] without spaces within [] will look like //code within Code (markup):
Thanks a lot guys. The possibility that I wasn't using square brackets for my CODE blocks occurred to me while I briefly woke up in the middle of the night! Unfortunately, I don't appear to have the option to edit my post. I guess that becomes impossible after a certain amount of time passes. It's interesting that I can't call functions with parameters from the onload function. I have to call parameterless functions (like onehundred())which then call my roll_variable_attacks() with the appropriate number. Tdemetri, I haven't tried your alternate code, yet. The only thing I might change is removing $("aDice").focus() from the onehundred() and onethousand() functions and putting it at the beginning of the onload function. That way the field is focused on before the user inputs all the particulars of the attack he's testing. I'll try your code and let you know if there are any problems. Thanks again!
I tried altering the code, as suggested, and it still runs through both functions when the page loads, rather than waiting for a button click to run the event handler. Maybe I'm misunderstanding event handlers? Let's see if I have the basics down. The following code is the event handler that should run when the page loads. Correct? This event handler creates two other event handlers (onclick) that are supposed to run when their respective buttons are pushed. The roll_variable_attacks() function shouldn't run until one of the buttons is pushed. Instead, the program behaves as if the user clicked both buttons at page load. This manner of creating event handlers works just fine in even simpler programs from my text book. What the heck am I doing wrong? Any ideas? window.onload = function () { $("aDice").focus(); $("roll_100").onclick = roll_variable_attacks(100); $("roll_1000").onclick = roll_variable_attacks(1000); } Code (markup):
hi - as i said - i don't really even know what you are doing with this , but , the code i fixed will work - whether it gives the results you want or not is another story. here it is posted on this page: demetri-media.com/JavaScript/battleGame.html try it and tell me if it works the way you expect it to. if you look at the code, you see that i took it OUT of an on load script - because the way i understood your first post, you didn't want it to run right away- you need to change values, and then click either the 100 or 1000 button. it now should do that, as it is associated now only with the button click. the code you have written does exactly like you state, which is NOT what you want. the only other thing i now also see is if you want the code to run on button press , but WITH the initial parameters of either 100 or 1000 ? if so, look at his example and see if it gives the right answers: demetri-media.com/JavaScript/battleGame2.html
I tried the first url you provided and it worked perfectly as I'd hoped. I couldn't get a page from the second url. I will take another look at the changed code you provided. The program I wrote was very loosely based on a simple one from my text book. The original calculated sales tax, or possibly compound interest; I don't recall. It did, however, have an onload function which created one or more button click event handlers for the user to run the program after entering the relevant numbers. I can't understand how that program behaved properly, while mine wouldn't. Anyhow, thanks again!
well, i am glad it is working for you and what you want - even if i don't fully understand what it is accomplishing ! just remember that onload will do that- it runs whatever is in that block of code at the beginning. yours had it also performing the 2 other functions, so they were all running in tandem. that could be fine,especially if you want to initialize things, etc, but in your case you needed to hold off running those 2 functions until someone actually clicked those buttons, so i just attached them to those buttons instead. that's all. happy coding !