JavaScript - Help With Creating A Basic Card Game
Hi there, basically i have created a simple card game, i have one html page with 6 decks of cards. The decks are just images that when clicked display 6 other cards on another html page. What i want to do is that when i click a card on the second page i want the card to be removed, so that when i go back the first page and select the same deck again, the second page opens and the card i had selected before is still removed? Is this possible with javascript please i am totally new to it. Please could someone give me some direction? Thanks
Similar TutorialsHow could you say make a x move around a grid using the arrow keys?
Create a game where 6 dice are 'rolled' by you and 6 dice are 'rolled' by the player (simulated by the click of a button). Add up both rolls. The goal is to come as close to a score of 100 as possible, without passing 100. Have a STOP button to signify when you are ready to stop rolling and compute the winner. The highest score under 100 wins. Display the number of times you win and the number of times the computer wins using javascript. So far I have the following code, however, my dice images are not working(they display as little broken symbols when I run the game). The game itself is running just fine but I can't figure out how to get the game to do the "Add up both rolls" step and beyond. If anyone can help it would be much appreciated. Thanks. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Dice Game</title> <link href="Dicegame.css" type="text/css" rel="stylesheet" /> </head> <body> <div id='human' class='playerArea'> <h3>Human</h3> <div id='humanDice'> </div> <p id='humanTotal' class='total'></p> </div> <div id='computer' class='playerArea'> <h3>Computer</h3> <div id='computerDice'> </div> <p id='computerTotal' class='total'></p> </div> <div id='roll'> <a href='#' onclick='play(); return false;'>Roll</a> </div> <script type='text/javascript' src='lib.js'></script> <script type='text/javascript' src='dicegame.js'></script> </body> </html> *the external links are as follows* *Dicegame.css* body { background-color: #004400; } div.playerArea { position: absolute; top: 100px; bottom: 200px; width: 300px; background-color: #0996FF; border: 3px solid #0027C6; padding: 0 1em; } div#human { left: 100px; } div#computer { right: 100px; } div#roll { position: absolute; bottom: 50px; left: 100px; right: 100px; height: 100px; background-color: #FFFF00; border: 3px solid #FFBE00; } div#roll:hover { background-color: #FFFF99; } div#roll a { display: block; position: absolute; top: 0px; bottom: 0px; width: 100%; color: #004400; text-align: center; font-size: 90px; text-decoration: none; } div#roll a:hover { color: #FF0000; } p.total { margin: 10px; font-weight: bold; font-size: 8em; text-align: center; } p.winner { color: #00CC00; } p.loser { color: #CC0000; }[/CODE] *dicegame.js* Code: window.onload=function(){ Nifty("div.playerArea", "big"); } function roll() { var result = 0; result = Math.floor((Math.random() * 6) + 1); return result; } function play() { // create dice array var humanDice = new Array(); var computerDice = new Array(); // totals var humanTotal = 0; var computerTotal = 0; // output var out = ""; // roll the dice for (var i = 0; i < 6; i++) { humanDice[i] = roll(); humanTotal += humanDice[i]; computerDice[i] = roll(); computerTotal += computerDice[i]; } // display human dice out = displayDice(humanDice); document.getElementById('humanDice').innerHTML = out; // display computer dice out = displayDice(computerDice); document.getElementById('computerDice').innerHTML = out; document.getElementById('humanTotal').innerHTML = humanTotal; document.getElementById('computerTotal').innerHTML = computerTotal; if (humanTotal > computerTotal) { document.getElementById('humanTotal').className = 'total winner'; document.getElementById('computerTotal').className = 'total loser'; } else if (computerTotal > humanTotal) { document.getElementById('humanTotal').className = 'total loser'; document.getElementById('computerTotal').className = 'total winner'; } else { document.getElementById('humanTotal').className = 'total'; document.getElementById('computerTotal').className = 'total'; } } function displayDice(dice) { var out = ""; for (var i = 0; i < dice.length; i++) { out += "<img src='die" + dice[i] + ".png'/>"; } return out; } *lib.js* Code: function output(text, tag) { document.write("<" + tag + ">" + text + "</" + tag + ">"); } hello there im unsure if this is the correct place to post this so if its not im sorry what im trying to do is make a javascript pop-up message in real time alerting members who are online at that time to a game submitted i help run a fifa10 online league site and we are venturing into the 2v2 part of the site. now when a player goes to the 2v2 page they are presented with a submit button to submit a 2v2 game to the system. then this already shows up on the pagebut what we are after is a little pop up box which after the game button is pressed to submit the game the pop-up shows to the whole site that a 2v2 game has been submitted for playing. we want this so you dont have to sit on the 2v2 page to wait for a submitted game. does anybody have any ideas on how we would go about this?? thanks for your time and i hope some1 can help - even if its just in the slightest Hi, I am working on a simple javascript craps game program. I need some advice since it won't display who the winner is, keep tally of who wins/loses, and the number of total games played. After using the error console there's an error with document.forms[0].thrower.value not being defined. Can anyone help me with this? PHP Code: <html> <head> <title> JavaScript Craps Game</title> <script type="text/javascript"> <!-- var n,die_1,die_2,total,h_won,c_won, flag, point,winner; function get_num() { var max = 6; var number=Math.random()*max + 1; var result=Math.floor(number); return result; } function roll_dice() { die_1 = get_num(); die_2 = get_num(); total= die_1 + die_2; // Insert the results of the dice into the appropriate fields document.getElementById("die1").innerHTML= die_1; document.getElementById("die2").innerHTML= die_2; document.getElementById("total").innerHTML= total; //document.forms[0].die1.value = die_1; //document.forms[0].die2.value = die_2; //document.forms[0].tot.value = total; //Subtracting 0 from these values forces them to be typed as numbers if (flag){ //This means we rolled something other than 2,3,7,11, or 12 so we have a point var th = document.forms[0].thrower.value; if (total == point) { //X wins winner = "x"; calculate_winnings(th,winner); flag = 0; //document.forms[0].flag.value="0"; game_count(); } else if (total == 7){ //Y wins winner = "y"; calculate_winnings(th,winner); flag = 0; //document.forms[0].flag.value="0"; game_count(); } } else{ var thwr = document.forms[0].thrower.value; if (total == 7 || total == 11) { //X wins document.getElementById("winner").innerHTML= "X Wins!"; //document.forms[0].winner.value= "X Wins!"; winner = "x"; calculate_winnings(thwr,winner); game_count(); } else if (total == 2 || total == 3 || total == 12){ //document.forms[0].winner.value= "Y Wins!"; document.getElementById("winner").innerHTML= "Y Wins!"; winner = "y"; calculate_winnings(thwr,winner); game_count(); } else { point = total; document.getElementById("winner").innerHTML= "Waiting for a 7 or a " + point; // document.forms[0].winner.value="Waiting for a 7 or a " + point; flag = 1; //document.forms[0].flag.value="1"; } } } function game_count() { //for keeping track of games if (n){ n = n + 1; } else { n = 1; } document.forms[0].totalgames.value = n; //return n; } function calculate_winnings(thrower,winner) { var button = document.forms[0].thrower.checked; if (button) { if (winner == 'x') { //computer was thrower and X won //document.forms[0].winner.value="Computer Wins!"; document.getElementById("winner").innerHTML= "Computer Wins."; add_to_computer_win(); } else { //computer was thrower and Y won //document.forms[0].winner.value="You win!"; document.getElementById("winner").innerHTML= "You win!"; add_to_human_win(); } } else { if (winner == 'x') { //human was thrower and X won //document.forms[0].winner.value="You Win!"; document.getElementById("winner").innerHTML= "You Win!"; add_to_human_win(); } else { //human was thrower and Y won //document.forms[0].winner.value="Computer Wins!"; document.getElementById("winner").innerHTML= "Computer Wins."; add_to_computer_win(); } } thrower = 0; } function add_to_human_win(){ if (h_won){ h_won = h_won + 1; } else { h_won = 1; } document.forms[0].human_won.value=h_won; } function add_to_computer_win(){ if (c_won){ c_won = c_won + 1; } else { c_won = 1; } document.forms[0].computer_won.value=c_won; } --> </script> </head> <body> <h1> <center> Craps Game </center></h1> <hr> <form> <table border="1"> <tr> <td width="45%" align="center"> <center><b><font size="4">Play!</font></b></center> <p><input type="button" name="roll" value="Roll Dice!" onclick="roll_dice()"></p> <table border="1"> <tr> <td>Die #1</td><td>Die #2</td><td>Total</td> </tr> <tr> <td><div id="die1"></div></td> <td><div id="die2"></div></td> <td><div id="total"></div></td> </tr> </table> <p>Result of roll: <div id="winner"></div></p> <!--<input type="text" size="30" name="winner" value=""></p>--> <p> </p> </td> <td width="35%"> <table border="1" cellspacing="7"> <tr> <th colspan="2" ><font size="4">Statistics:</font><br> <input type="text" size="2" name="totalgames" value="0"> total games played</th> </tr> <tr> <td align="center">Your wins</td><td>Computer wins</td> </tr> <tr> <td align="center"><input type="text" size="2" name="human_won" value="0"></td> <td align="center"><input type="text" size="2" name="computer_won" value="0"></td> </tr> </table> </td><td width="20%" align="center"> This will clear your statistics and start a new game<br> <input type="submit" name="startover" value="New Game"> </td></tr></table> <hr> <h3><a name="Help">Help</a></h3> <pre> The game of craps is a dice game played by two players, You and The House. First you toss the pair of dice. If the sum of the dice is 7 or 11, you win the game. If the sum is 2, 3, or 12, the house wins. Otherwise, the sum is designated as the "point," to be matched by another toss. So if neither player has won on the first toss, then the dice are tossed repeatedly until either the point or a 7 comes up. If a 7 comes up first, the house wins. Otherwise, you win when the point comes up. </body> </html> Ok so I'm in college and I'm taking my first web development class online. Unfortunate my teacher is awful. We have already "covered" html and some css and done a bit of java such as creating a prompt and a super simple calculator. However, for the final I have to make a 2 player game with at least 30 spaces and dice (random number generator). More importantly our "learn javascript in 24 hours" book doesn't cover this at all and my teacher is MIA like always. So, I have come to you all for help. I found a sample script that is almost exactly what I need for this project but it needs a bit of tweaking http://javascript.internet.com/games...ders-game.html I need to add 5 additional spaces and I wanted to add a ladder from space 24-27 and change the chute from 16-6 to 25-6. Unfortunately I'm kind of clueless on how to do this and make sure everything works properly.... Here is an image I made real quick of what I want it to look like And this is the requirements for the project. * Minimum Requirements for a C: o 2 players o 20 steps on the board o Random number generator o Game displays the location of each player on the board * Minimum Requirements for a B: o Everything above plus o Attractive user interface. o 30 steps on the board o Graphical random number generator (Example: Display the number as a dice image) * Minimum Requirements for an A: o Everything above plus o Educational game that shows facts as the players move around the game. Any help at all would be amazing and greatly appreciated This is my first posting on this forum so please be gentle Here is the link to a page on my work web: - http://www.deltaclub.co.uk/businesslinkform.html You will see that I have three combo box objects on this form - one containing dates (Date) and the other two containing times (Time1 & Time2). Each time on each date is an available appointment. I would like the content of the date combos to be read from a file whenever the page is opened - a text file with one record per row would be fine (by way of an example - but this may be insufficient). On the face of it this would seem fairly rudimentary but I don't code in JavaScript of PHP and, having found this site I can make a start. I used to be a VB coder. On each date the following appointment times are available: - 10:00 11:00 12:00 14:00 15:00 This assumes that no appointments on a given day are taken. This leads me to conclude that each date should have records for each time - possibly as a CSV text file as follows: - "29th May 2009","10:00" "29th May 2009","11:00" "29th May 2009","12:00" "29th May 2009","14:00" "29th May 2009","15:00" "14th June 2009","10:00" "14th June 2009","11:00" "14th June 2009","12:00" "14th June 2009","14:00" "14th June 2009","15:00" The second time combo should make unavailable the time selected in the first time combo and present only those times available on the chosen date in the CSV file on the server. When I confirm appointments, at present I have to edit the page objects and update the web - which is quite messy and slow whereas uploading a simple text file, whilst an imperfect solution, is much better than what I currently have. I believe that a PHP or Javascript routine based on events on the three objects would remove the inherent problems and would provide a useful set of building blocks for other routines of a similar nature. The routine would trigger whenever the page is loaded (or refreshed) or the content of any one of the three objects gets or loses the focus or a selection is made in an object. The Date Combo would need to look up the available dates - keeping the currently selected date selected or, if that date is no longer available defaulting to the first date in the list. The user then makes a selection or makes no change to the selected date. The Time1 Combo then reads the available times for that date, retains the currently selected time (if available) or the first available time (if the selected is not available) and the user makes a selection or accepts the current selection. The Time2 Combo does the same as the Time1 Combo and in addition it eliminates the time selected in the Time1 Combo from the available choices. The result is that visitors are only offered available times on available dates (insofar as this solution provides). When the form is submitted I would receive the email and confirm the appointment with the client and, in addition, I would modify and upload the modified data file to the web server using Filezilla. The benefit is that there is a slim to none chance of two people wanting to book the same times on the same date at exactly the same time (though it is possible). In addition, I can add new dates and add new times if there is a demand and I can even add previously deleted times if there is sufficient demand to warrant bringing in a second consultant to take the meetings. I'm aware of the commercial solutions that are available but my boss won't pay for them and having a solution that could be adapted to bolt into any scenario (with suitable code modifications) would be a real asset. Any contribution would be most gratefully accepted. Thank you for reading this. __________________ Kind regards, Martyn Required knowledge increases at a rate exponential to the rate at which knowledge may be acquired. Ok so i want to work on an EASY basic game. As simple as Guess what number... But there are some twist... Ok So here is my example... (HTML, i know this.)I'm Guessing a number 1-99. What is it? (java) Lets say its 66 and they guess 53, have the text rusult be in a pop up window be: Too low! (java) Lets say they guess 78, have the text rusult be in a pop up window be: Too high! (java) Lets say they guess 100+, have the text rusult be in a pop up window be: Out of range! (java)But lets say they guess 66, have a text result be in a pop up window be: You've won! (java) I want a text field where you can enter your answer, and it will do the actions above. Can anyone code this? Thanks for reading! This is a simple basic game i want to make. Its a "What Am I" Riddle... The questions is (In HTML which i already know): I'm as light as a feather but no man can hold me for long. What am I? the answer is: Your Breath. (This is where the JAVASCRIPT comes in) Lets say they guess a rock, have a pop up say: Wrong Answer. Please try again. Lets say they guess Your breath -OR- Breath, have a pop up say: Correct! I want a text field where you can enter your answer, and if they choose ANYTHING but the 2 correct answers above, it will display please try again. Can anyone code this please? Thanks for reading. Hi all, Im trying to get this working for my Website i have seen alot of Credit Card code both JS and Jquery I have came across one that i really like all the user has to do is enter in his Card Number and it will auto detect what type of card he/she has . Code: <input id="ccNumber" onChange="SetTypeText(this.value)" /> <br /> <div id="cardType"></div> Code: <script type="text/javascript"> function SetTypeText(number) { var typeField = document.getElementById("cardType"); typeField.innerHTML = GetCardType(number); } function GetCardType(number) { var re = new RegExp("^4"); if (number.match(re) != null) return "Visa"; re = new RegExp("^(34|37)"); if (number.match(re) != null) return "American Express"; re = new RegExp("^5[1-5]"); if (number.match(re) != null) return "MasterCard"; re = new RegExp("^6011"); if (number.match(re) != null) return "Discover"; return ""; } </script> But cant seem how i could place in code to see if the card is valid or invalid as alot of the source code out their is using Selection and Arrays.. Does any one know how i could get Validation done with the auto Detect Card code ? Code: cards [0] = {cardName: "Visa", lengths: "13,16", prefixes: "4", checkdigit: true}; cards [1] = {cardName: "MasterCard", lengths: "16", prefixes: "51,52,53,54,55", checkdigit: true}; cards [2] = {cardName: "DinersClub", lengths: "14,16", prefixes: "300,301,302,303,304,305,36,38,55", checkdigit: true}; cards [3] = {cardName: "CarteBlanche", lengths: "14", prefixes: "300,301,302,303,304,305,36,38", checkdigit: true}; cards [4] = {cardName: "AmEx", lengths: "15", prefixes: "34,37", checkdigit: true}; cards [5] = {cardName: "Discover", lengths: "16", prefixes: "6011,650", checkdigit: true}; cards [6] = {cardName: "JCB", lengths: "15,16", prefixes: "3,1800,2131", checkdigit: true}; cards [7] = {cardName: "enRoute", lengths: "15", prefixes: "2014,2149", checkdigit: true}; cards [8] = {cardName: "Solo", lengths: "16,18,19", prefixes: "6334, 6767", checkdigit: true}; cards [9] = {cardName: "Switch", lengths: "16,18,19", prefixes: "4903,4905,4911,4936,564182,633110,6333,6759", checkdigit: true}; cards [10] = {cardName: "Maestro", lengths: "16,18", prefixes: "5020,6", checkdigit: true}; cards [11] = {cardName: "VisaElectron", lengths: "16", prefixes: "417500,4917,4913", checkdigit: true}; var cardType = -1; for (var i=0; i<cards.length; i++) { if (cardName.toLowerCase() == cards[i].cardName.toLowerCase()) { cardType = i; break; } } if (cardType == -1) { return false; } // card type not found value = value.replace (/[\s-]/g, ""); // remove spaces and dashes if (value.length == 0) { return false; } // no length var cardNo = value; var cardexp = /^[0-9]{13,19}$/; if (!cardexp.exec(cardNo)) { return false; } // has chars or wrong length cardNo = cardNo.replace(/\D/g, ""); // strip down to digits if (cards[cardType].checkdigit){ var checksum = 0; var mychar = ""; var j = 1; var calc; for (i = cardNo.length - 1; i >= 0; i--) { calc = Number(cardNo.charAt(i)) * j; if (calc > 9) { checksum = checksum + 1; calc = calc - 10; } checksum = checksum + calc; if (j ==1) {j = 2} else {j = 1}; } if (checksum % 10 != 0) { return false; } // not mod10 } var lengthValid = false; var prefixValid = false; var prefix = new Array (); var lengths = new Array (); prefix = cards[cardType].prefixes.split(","); for (i=0; i<prefix.length; i++) { var exp = new RegExp ("^" + prefix[i]); if (exp.test (cardNo)) prefixValid = true; } if (!prefixValid) { return false; } // invalid prefix lengths = cards[cardType].lengths.split(","); for (j=0; j<lengths.length; j++) { if (cardNo.length == lengths[j]) lengthValid = true; } if (!lengthValid) { return false; } // wrong length return true; }, jQuery.validator.messages.creditcard); I would like help because I cannot find the error in my code. js code Code: function luhnCheckSum(sCardNum) { var iOddSum = 0; var iEvenSum = 0; var bIsOdd = true; for (var i=sCardNum.length-1; i >= 0; i--) { var iNum = parseInt(sCardNum.charAt(i)); if (bIsOdd) { iOddSum += iNum; } else { iNum = iNum * 2; if (iNum > 9) { iNum = eval(iNum.toString().split("").join("+")); } iEvenSum += iNum; } bIsOdd = !bIsOdd; } return ((iEvenSum + iOddSum) % 10 == 0); } function isValidVisa(sText) { var reVisa = /^(4\d{12}(?:\d{3})?)$/; if (reVisa.test(sText)) { alert("Please enter a Card Number."); clock.CardNumber.focus(); return luhnCheckSum(RegExp.$1); } else { alert("This card number is not valid."); return false; } } html Code: <input type="text" size="16" name="Card_Number" onmouseout="isValidVisa(this)"/> Starting off by saying this is directly from a book: Code: <script type="text/javascript"> /* <![CDATA[ */ function validateCard(){ //American Express if(document.forms[0].cardName.value =="American Express"){ var cardProtocol = new RegExp("^3[47][0-9]{13}$"); if(cardProtocol.test(document.forms[0] .cardNumber.value)) document.forms[0].ccResult.value ="Valid credit card number"; else document.forms[0].ccResult.value ="Invalid credit card number"; } //Diners Club else if(document.forms[0].cardName.value =="Diners Club"){ var cardProtocol = new RegExp("^3(?:0[0-5]|[68][0-9])[0-9]{11}$"); if(cardProtocol.test(document.forms[0] .cardNumber.value)) document.forms[0].ccResult.value ="Valid credit card number"; else document.forms[0].ccResult.value ="Invalid credit card number"; } //Discover else if(document.forms[0].cardName.value =="Discover"){ var cardProtocol = new RegExp("^6(?:011|5[0-9]{2})[0-9]{12}$"); if(cardProtocol.test(document.forms[0] .cardNumber.value)) document.forms[0].ccResult.value ="Valid credit card number"; else document.forms[0].ccResult.value ="Invalid credit card number"; } //JCB else if(document.forms[0].cardName.value =="JCB"){ var cardProtocol = new RegExp("^(?:2131|1800|35\d{3})\d{11}$"); if(cardProtocol.test(document.forms[0] .cardNumber.value)) document.forms[0].ccResult.value ="Valid credit card number"; else document.forms[0].ccResult.value ="Invalid credit card number"; } //Mastercard else if(document.forms[0].cardName.value =="Mastercard"){ var cardProtocol = new RegExp("^5[1-5][0-9]{14}$"); if(cardProtocol.test(document.forms[0] .cardNumber.value)) document.forms[0].ccResult.value ="Valid credit card number"; else document.forms[0].ccResult.value ="Invalid credit card number"; } //Visa else if(document.forms[0].cardName.value =="Visa"){ var cardProtocol = new RegExp("^4[0-9]{12}(?:[0-9]{3})?$"); if(cardProtocol.test(document.forms[0] .cardNumber.value)) document.forms[0].ccResult.value ="Valid credit card number"; else document.forms[0].ccResult.value ="Invalid credit card number"; } } /* ]]> */ </script> With a drop down box for the card type and a text-box to input a credit card number of appropriate length. My question, the teacher asked us to help make this code more "efficient" and I'm still learning the language, and was wondering if a loop could be utilized to make the code more efficient? Switch statement would just repeat the code practically Here's another problem I'm having, I have to validate credit card types. My code worked originally. I simply checked the prefix for each type then verified the length with an if statement. However, I decided to change the code so that only numbers would work after the prefix (as the old code would have allowed any character). This is the code I have: 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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Credit Card Validation</title> <link rel="stylesheet" type="text/css" href="default.css" /> <script type="text/javascript"> function checkCC(myForm) { var ccType; var ccLength; var ccNum = myForm.cardNum.value; if (myForm.cardType.selectedIndex == 0) { ccType = "Visa"; } else if (myForm.cardType.selectedIndex == 1) { ccType = "MasterCard" } else if (myForm.cardType.selectedIndex == 2) { ccType = "AmericanExpress" } switch(ccType) { case "Visa": { valid = /^4\d{12}(?:\d{3})?$/; if (valid.test(myForm.cardNum.value)) { alert("This is a Valid Visa Card"); return true; } else { alert("This Card Number is Invalid For Visa"); return false; } break; } case "MasterCard": { valid = /^5[1-5]\d{14}$/; if (valid.test(myForm.cardNum.value)) { alert("This is a Valid MasterCard Card"); } else { alert("This Card Number is Invalid For MasterCard"); } break; } case "AmericanExpress": { valid = /^3[47]\d{13}$/; if (valid.test(myForm.cardNum.value)) { alert("This is a Valid American Express Card"); //return true; } else { alert("This Card Number is Invalid For American Express"); //return false; } break; } default: myForm.cardNum.value = null; alert("Card type not found"); return false; } } </script> </head> <body> <h1>Credit Card Validator</h1> <table> <form name="creditCard"> <tr> <td><span class="labels">Card Type:</span></td> <td> <select name="cardType" size="3"> <option name="visa">Visa</option> <option name="mc">Master Card</option> <option name="amex">American Express</option> </select> </td> <tr> <td><span class="labels">Card Number:</span></td> <td><input name="cardNUm" type="text" size=30 value="" /></td> </tr> <tr><td colspan="2"> </td></tr> <tr> <td> <input type="button" value="Death to All" style="background-color:#666666 !important" onclick="return(checkCC(this.form,))" /> </td> </tr> </form> </table> </body> </html> Upon pressing the button nothing happens, I'm completely unsure where I went wrong as all the code seems valid... Please help. Thanks in advance. I am tired and fatigued, but I don't believe enough to not find obvious mistakes. I'm having a very strange issue that I have not encounted where a HTML form is submitting when just the first two INPUT's are filled in, but it shouldn't be able to submit because there are still other INPUT boxes that are empty and required to be filled for JavaScript to allow the form to submit. Can anyone see what the problem is? Code: <SCRIPT type="text/javascript"> function validateForm() { if (document.forms["form"]["cardholdername"].value=="") { alert ("Cannot proceed to purchase because a Visa card name has not been specified."); return false; } if (document.forms["form"]["cardnumber"].value=="") { alert ("Cannot proceed to purchase because a Visa card number has not been specified."); return false; } if (document.forms["form"]["cardexpirymonth"].value=="") { alert ("Cannot proceed to purchase because a Visa card expiry month has not been selected."); return false; } if (document.forms["form"]["cardexpiryyear"].value=="") { alert ("Cannot proceed to purchase because a Visa card expiry year has not been selected."); return false; } if (document.forms["form"]["cardcvv"].value=="") { alert ("Cannot proceed to purchase because a Visa card CVV has not been specified."); return false; } if (document.forms["form"]["cardholdere-mailaddress"].value=="") { alert ("Cannot proceed to purchase because a Visa card holder e-mail address has not been specified."); return false; } if (document.forms["form"]["cardholdercontactnumber"].value=="") { alert ("Cannot proceed to purchase because a Visa card holder contact number has not been specified."); return false; } } </SCRIPT> Code: <FORM action="processpaymentinformation.html" method="post" name="form" onsubmit="return validateForm()"> <DIV class="payment"> <DIV class="visacard"><B>Visa card:</B></DIV> <BR> <DIV class="cardholdername"><B>Name:</B> <INPUT name="cardholdername" type="text"></DIV> <DIV class="cardnumber"><B>Number:</B> <INPUT name="cardnumber" type="text"></DIV> <DIV class="cardexpirymonth"><B>Expiry month:</B> <SELECT name="cardexpirymonth"> <OPTION></OPTION> <OPTION>01</OPTION> <OPTION>02</OPTION> <OPTION>03</OPTION> <OPTION>04</OPTION> <OPTION>05</OPTION> <OPTION>06</OPTION> <OPTION>07</OPTION> <OPTION>08</OPTION> <OPTION>09</OPTION> <OPTION>10</OPTION> <OPTION>11</OPTION> <OPTION>12</OPTION> </SELECT> </DIV> <DIV class="cardexpiryyear"><B>Expiry year:</B> <SELECT name="cardexpirymonth"> <OPTION></OPTION> <OPTION>13</OPTION> <OPTION>14</OPTION> <OPTION>15</OPTION> <OPTION>16</OPTION> <OPTION>17</OPTION> </SELECT> </DIV> <DIV class="cardcvv"><B>CVV:</B> <INPUT class="cardcvv" name="cardcvv" type="password"></DIV> <BR> <BR> <DIV class="visacardholder"><B>Visa card holder:</B></DIV> <BR> <DIV class="cardholdertitle"><B>Title:</B> <SELECT name="cardholdertitle"> <OPTION></OPTION> <OPTION>Dr</OPTION> <OPTION>Madam</OPTION> <OPTION>Miss</OPTION> <OPTION>Mr</OPTION> <OPTION>Mrs</OPTION> <OPTION>Ms</OPTION> <OPTION>Sir</OPTION> </SELECT> </DIV> <DIV class="cardholdere-mailaddress"><B>E-mail address:</B> <INPUT name="cardholdere-mailaddress" type="text"></DIV> <B>Contact number:</B> <INPUT name="cardholdercontactnumber" type="text"> </DIV> <DIV> <INPUT class="submit" type="submit" value="PROCEED TO PURCHASE"> </DIV> </FORM> Hey. I am looking for a gallery/image slider script that looking like this image/or does the same as the image below: Something like that or similar if anyone knows a link to one or knows the code please help. Thanks for reading. Mark. I have a game page on my site and I am trying to protect direct access to it by .htaccess .htpasswd but is not accepting user name and password? .htaccess: AuthUserFile /home/vhosts/kandcoentertainment.freetzi.com/.htpasswd AuthType Basic AuthName "game1" <Files "cookietest.html"> Require valid-user </Files> .htpasswd test:8888 Any suggestions on why it is not working? What I would like to do is have apay and play once setup but as I am a novice and dont have a clue HELP PLEASE!!! What I have been told is - protect the files, add a client side cookie to game page then upon url payment return validate cookie giving single access and when played the user cannot replay by refresh or just typing in url because cookie expired ? I have tried to write the scripts up with no success. Hello everyone. I have a tic tac toe game I am working on and I managed to make it so you can place X's and O's respectively. My next problem is making a win condition so it checks to see if the X's won the game or the O's did. Here is what I have so far. Edit fiddle - JSFiddle What I am basically thinking is that when you are clicking I want whatever letter it is that is placed to be saved and then I can check to see if all 3 are equal to that letter. It is a bit hard to explain. Essentially I want to make a win condition. If anyone could throw some assistance my way that would be great. I know for sure it requires a lot of checks because there are so many different ways of winning, I just need to know that initial one. Thank you very much. What I'm trying to achieve is it initialises a number between 1-2000 randomly. When the submit button is clicked it simply returns if the number that is in putted is higher or lower than the randomly initialised number. External JavaScript: Html Code: <html> <head> <script type="text/javascript" src="jsscri.js"></script> </head> <body onload="initialisation ()"> <form name="exampleform"> <h3> Number: <input name="number" type="text" onchange='checkNumber( this.value );'> </h3> <p> <input name="submit" type="button" value="Guess" onclick= 'checkValue()';/> </p> </body> </html> If you load this onto a webpage you'll see what i'm trying to do. I tried deleting the rest of the code to keep the size of the code down. Hi every1! Got a task in university to make a memory game (card matching game). Thats what i've got so far: Code: var selected = 0; var choiceOne; var choiceTwo; var matches = 0; var numOfTries = 0; var interval = 700; var gamePlace = document.getElementById("wrap"); var backcard="img/memoryBg.png"; var timeStart; var timeFinish; var time; function nameEnter(){ var name = prompt("Please enter your name"); if (name != null){ document.title = "Welcome " + name + "!"; } } function game(){ var nOfPairs = document.getElementById("nPairs").value; timeStart = new Date().getTime(); if (nOfPairs==1){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; } if (nOfPairs==2){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==3){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==4){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==5){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==6){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards.sort(function shuffle() { return Math.random() - 0.5;}); } if (nOfPairs==7){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards[12] = 'img/card7.png'; cards[13] = 'img/card7.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==8){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards[12] = 'img/card7.png'; cards[13] = 'img/card7.png'; cards[14] = 'img/card8.png'; cards[15] = 'img/card8.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if(nOfPairs>8||nOfPairs<1){ alert("Please enter the number from 1 to 8"); }else{ for(i = 0; i<=nOfPairs*2-1; i++){ var cardDiv = document.createElement("div"); cardDiv.setAttribute("id",""+i+""); cardDiv.style.height="65px"; cardDiv.style.width="65px"; cardDiv.style.float='left'; gamePlace.appendChild(cardDiv); document.getElementById(""+i+"").innerHTML='<img src="img/memoryBg.png">'; cardDiv.onclick=function(){cardClick(this.id);}; } } function cardClick(card){ if (selected==2){ return ; } if (selected==0){ choiceOne=card; document.images[card].src = cards[card]; selected = 1; }else { selected = 2; choiceTwo = card; document.images[card].src =cards[card]; var timer=setInterval(checking,interval); } function checking() { clearInterval(timer); numOfTries++; document.getElementById("tries").innerHTML = numOfTries; if (cards[choiceTwo]==cards[choiceOne]){ matches++; document.images[choiceOne].src = "img/memoryBgI.png"; document.images[choiceTwo].src = "img/memoryBgI.png"; //choiceTwo.onclick=null; } else { document.images[choiceOne].src = "img/memoryBg.png"; document.images[choiceTwo].src = "img/memoryBg.png"; selected = 0; return ; } if (matches == nOfPairs){ timeFinish = new Date().getTime(); time = Math.round (((timeFinish - timeStart)/1000)); alert("Congrats! You needed " + numOfTries + " tries, and " + time + " seconds."); } selected = 0; return ; } } } so the problem is, that I can just click 2 times on one card and it will look like a coincidence. My second problem is that when I have a real coincidence, I can still click on that card (by "real coincidence" i mean two same pics. so when i find them, they have to be not active, and when im clicking on them, they should just simply do nothing.). Can someone help me? Hello, I am trying to create a clock for my video game. I need to begin the clock at zero and count while the game is going. I need to have the clock count in standard minutes and seconds but not be based on the actual time of day. I am coding in javascript for an applet.
A newbie here can you please help me with my javascript game. I cant seem to make it work. Quote: <!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> <meta http-equiv="Content-Language" content="en-us" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Play</title> <script type='text/javascript'> function win(x, z){ if(x == z) return "It's a draw"; draw.value++; { if(x == "Fire")&&(z == "Air") return "You Lose, Fire beats Air!"; loss.value++; else if(x == "Fire")&&(z == "Earth") return "It's a draw!"; draw.value++; else if(x == "Fire")&&(z == "Water") return "You Win, Fire is beaten by Water!"; win.value++; } { if(x == "Air")&&(z == "Earth") return "You win, Air beats Earth"; win.value++; else if(x == "Air")&&(z == "Water") return "It's a draw!"; draw.value++; else if(x == "Air")&&(z == "Fire") return "You lose, Air is beaten by Fire!") loss.value++ } { if(x == "Earth")&&(z == "Air") return "You Lose, Earth is beaten by Air" loss.value++; else if(x == "Earth")&&(z == "Water") return "You Win, Earth beats Water"; win.value++; else if(x == "Earth")&&(z == "Fire") return "It's a draw!"; draw.value++; } { if(x == "Water")&&(z == "Fire") return "You win, Water beats Fire"; win.value++; else if(x == "Water")&&(z == "Air") return "It's a draw!"; draw.value++; else if(x == "Water")&&(z == "Earth") return "You lose, Water is beaten by Earth" loss.value++; } } function ran(){ var gen = Math.random(); if(gen <= 0.25) var com = "Fire"; if((gen > 0.25)&&(gen<= 0.50)) var com = "Earth"; if(gen > 0.50)&&(gen<= 0.75)) var com = "Water"; if(gen > 0.75) var com = "Air"; if(document.c.game[0].checked) var use = "Fire"; if(document.c.game[1].checked) var use = "Earth"; if(document.c.game[2].checked) var use = "Water"; if(document.c.game[3].checked) var use = "Air"; alert ("The computer played: " + com +". You played: " + use + ". " + win(com,use)); } </script> <style type="text/css"> body {background-color:#7f9527;} .style1 { color: #FFFFFF; } .style2 { font-family: "After Disaster"; } .style3 { font-family: "After Disaster"; font-size: 30pt; color: #FFFFFF; margin-left: 160px; } .style4 { font-size: xx-large; } .style5 { color: #FFFFFF; font-size: large; } .style6 { color: #FFFFFF; font-family: "After Disaster"; font-size: large; } .style7 { margin-top: 0px; } .style8 { color: #FFFFFF; font-family: "After Disaster"; font-size: xx-large; margin-left: 280px; } .style9 { font-size: large; } .style10 { margin-top: 12px; } </style> </head> <body> <p class="style3" style="width: 581px">Avatar The Last Air bender: Element Fight</p> <p class="style8" style="width: 340px"> <img alt="" src="Avatar_Aang_by_Shira_chan.jpg" width="339" height="244" class="style7" /></p> <p class="style6">Select Your Attack</p> <form name="c" method="post" class="style2"> <span class="style4"><span class="style9"> <input name="game" type="radio" value="Fire" /></span></span><span class="style5">Fire</span><span class="style9"><br /> </span><span class="style4"><span class="style9"> <input name="game" type="radio" value="Earth" /></span></span><span class="style5">Earth</span><span class="style9"><br /> </span><span class="style4"><span class="style9"> <input name="game" type="radio" value="Water" /></span></span><span class="style1"><span class="style9">Water<br /> <span class="style4"> <input name="game" type="radio" value="Air" /></span>Air</span><br /></span> <tr> <td colspan="4" align=center> <span class="style2"> <input type="text" name= "win" readonly="readonly" value="0" size="2"> Wins </input> <input type="text" name= "loss" readonly="readonly" value="0" size="2"> Losses</input> <input type="text" name= "draw" readonly="readonly" value="0" size="2"> Draws</input> </span> </td> </tr> </form> <form method="post"> <br /> <input name="Play" type="button" value="Play" onClick="ran()" style="width: 189px; height: 39px" /> <a href="Instructions.htm"> <input name="Button1" type="button" value="Instructions" style="width: 189px; height: 39px" class="style10" /></a></form> </body> </html> |