By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,448 Members | 878 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,448 IT Pros & Developers. It's quick & easy.

Want user to choose game that uses different JS, but same HTML

tpgames
100+
P: 785
I'm not sure what search terms to put in to find a sample JavaScript that will give me what I need.

I have a Scrambled word game whereby the ONLY thing that changes with the different games is the link to the JavaScript. I know that I can make a page that has 1 HTML page, and a link to the various JS files, whereby the user can choose which game that want to play, without having 26 separate HTML files. However, I do not know how to research to find a code like this, nor can I figure out how to program this.

HTML page
JS drop down Menu

Wanted Result: JS code grabbed, with HTML page showing whats needed for game to be playable, but access the answers from the JS page.

I know that I have to use an Array, with links to the JS files, and some sort of drop down menu, but I don't know how to get the current HTML file, to show the game but with the JS chosen for playing the game. PS. My JavaScript knowledge is extreme newbie with brain damage. I'm only beginning to understand some JS concepts. Thanks in advance!

The code as it stands is: JavaScript
Expand|Select|Wrap|Line Numbers
  1.  var word=new Array("waschbecken","toilette","seife","badewanne","wasserhahn","handtuch","dusche","waschlappen","toilettenpapier","wasser","zahnpasta","zahnbürste");
  2. var letter=new Array();
  3. var rand;
  4. var actual;
  5. window.onload=main;
  6. function main()
  7. {
  8.   getRand();
  9.     scrambleWord();
  10.     creatWord();
  11. }
  12. function scrambleWord()
  13. {
  14.  actual=word[rand];
  15.  Temp=word[rand].length;
  16.   for(var myx=0;myx<Temp+2;myx++)
  17.     {
  18.      zmyx1=myx-1;
  19.       letter[myx]=word[rand].substring(zmyx1,zmyx1-1)
  20.     }
  21.     letter.sort();
  22.     word[rand]="";
  23.     for(var myx=0;myx<Temp+2;myx++)
  24.     word[rand]+=letter[myx];
  25. }
  26. function getRand()
  27. {
  28.   rand=Math.floor(Math.random()*word.length);
  29. }
  30. function creatWord()
  31. {
  32.  for(var x=0;x<word[rand].length+2;x++)
  33.  {
  34.   zmyx1=x-1;
  35.   a=document.createElement('a');
  36.     a.id="aid"+x;
  37.     a.className="scramble";
  38.     a.innerHTML=word[rand].substring(zmyx1,zmyx1-1);
  39.     a.href="javascript:append('"+x+"');";
  40.     document.getElementById('board').appendChild(a);
  41.  }
  42. }
  43. function creatWord2(x)
  44. {
  45.   zmyx1=x-1;
  46.   a=document.createElement('a');
  47.     a.id="aid2"+x;
  48.     a.className="scramble";
  49.     a.innerHTML=word[rand].substring(zmyx1,zmyx1-1);
  50.     a.href="javascript:retract('"+x+"');";
  51.     document.getElementById('assemble').appendChild(a);
  52.  
  53. }
  54. function append(zmyx1)
  55. {
  56.   document.getElementById('aid'+zmyx1).style.visibility="hidden";
  57.     //document.getElementById('assemble').innerHTML+=document.getElementById('aid'+zmyx1).innerHTML;
  58.     creatWord2(zmyx1);
  59. }
  60. function retract(zmyx1)
  61. {
  62.   document.getElementById('aid'+zmyx1).style.visibility="visible";
  63.     elem=document.getElementById('aid2'+zmyx1);
  64.     document.getElementById('assemble').removeChild(elem);
  65. }
  66. function showWord()
  67. {
  68.   document.getElementById('theWord').innerHTML=actual;
  69. }
  70.  

HTML code
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title> Scrambled Words </title>
  5.  
  6. <META http-equiv="expires" content="Thur, 1 March 2007 13:00:00 GMT">
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  8. <link type="text/css" rel="stylesheet" 
  9. href="http://www.globalwritersclub.com/gaming/2/word/scrambled/css/scrambled.css"> 
  10.  
  11. <script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1a.js"></script>
  12. <link rel="shortcut icon" href="http://www.globalwritersclub.com/gwc/img/gwcicon.gif">
  13.  
  14. <style type="text/css">
  15. <!--
  16. body {
  17.           text-align:center;
  18.          }
  19. a.scramble {
  20.                        color:#9D23EB;
  21.                          font-weight:bold;
  22.                          font-size:30;
  23.                          position:relative;
  24.                      }
  25. span#assemble {
  26.                          font-weight:bold;
  27.                          font-size:30;
  28.                          position:relative;
  29.                          }
  30. span#theWord {
  31.                          color:#0000ff;
  32.                          background-color:#000000;
  33.                          font-weight:bold;
  34.                          font-size:30;
  35.                          position:relative;
  36.                          border:2 inset gray;
  37.                          }
  38. a:hover {
  39.                   background-color:#000000;
  40.                     color:#0000ff;
  41.                 }
  42. -->
  43. </style>
  44.  
  45. </head>
  46.  
  47. <body>
  48.     <table border="0" cellspacing="0" cellpadding="0" summary="HEADER TABLE" width="950px">
  49.   <tr>
  50.     <td> <br></td>
  51.  
  52.     <td class="logoindxblk">
  53. <p class="plogoindx">
  54. <span class="graphicsp">
  55. <span class="graphics1p"> Scrambled Words </span>
  56. <span class="graphics2p"> Durcheinanderbringen Wörter  </span>
  57.  
  58. </span>
  59.  
  60. <span class="graphics">
  61. <span class="graphics3p"> Mots Confondants  </span>
  62. <span class="graphics4p"> Cмешанным Cлов </span>
  63. </span>
  64.  
  65. <span class="graphics">
  66. <span class="graphics5p"> Palabras Confusión </span>
  67. <span class="graphics6p"> Verwarrende Woorden </span>
  68.  
  69. </span>
  70.  
  71. <span class="graphics">
  72. <span class="graphics7p"> 交絡言葉 </span>
  73. <span class="graphics8p"> Parole di Confondimento </span>
  74. <span class="graphics9p"> Palavras de Confusão </span>
  75. </span></p>
  76.  
  77.     </td>
  78.  
  79.     <td><img src="/gwc/img/clear.gif" alt="" border="0" width="20" height="0"> <br></td>
  80. <!-- GLOBE -->        
  81.     <td class=logotmp"> 
  82. <br>&nbsp;<br>
  83. <img src="/gwc/img/100.gif" alt="" border="0" width="100" height="100">
  84.     </td>
  85.    <td><img src="/gwc/img/clear.gif" alt="" border="0" width="20" height="0"> <br></td>
  86.  
  87.    </tr>
  88.  
  89. <table border="2" align="center" width="100%" cellpadding="5" border="2">
  90. <tr>
  91. <td class="ctr">
  92.  
  93.   <br />
  94.  
  95.   <span id="board"></span>
  96.     <br /><br />
  97.     <span id="assemble"></span>
  98.     <br />
  99.     <br />
  100.  
  101.         <span id="theWord"></span>
  102.     <form>
  103. <br />
  104.     <input type="button" value="^-^ ?" onclick="showWord();" />
  105.  
  106.    <b style="visibility:hidden">__</b>
  107.     <input type="button" value="Start!" onclick="javascript:history.go(0);" />
  108.  
  109.     </form>
  110.  
  111. </td>
  112. </table>
  113. <!-- **FOOTER**  Edited out -->      
  114. </body>
  115. </html>
  116.  
Mar 8 '10 #1
Share this Question
Share on Google+
13 Replies


tpgames
100+
P: 785
Forget the code above as its not even close to what I should have posted. Sorry!
Here's what I've got so far. I do not know how to get the Arrays to communicate and then have html code use the JS selected.

Thanks!

Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html lang="utf-8">
  3. <head>
  4. <title> Scrambled Words </title>
  5.  
  6. <META http-equiv="expires" content="Thur, 1 March 2007 13:00:00 GMT">
  7. <meta http-equiv="Content-Type" content="text/html charset=utf-8">
  8. <link type="text/css" rel="stylesheet" 
  9. href="http://www.globalwritersclub.com/gaming/2/word/scrambled/css/scrambled.css"> 
  10. <script type="text/javascript" src="http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/1a.js">
  11. </script> 
  12.  
  13. <!-- hangman script originally by Chris Fortey @ http://www.c-g-f.net -->
  14.  
  15. <script language="JavaScript" type="text/javascript">
  16.  
  17. var wordlistAry=['1a.js'];
  18. var  wordlistAry2=['1b.js'];
  19. var  wordlistAry3=['1c.js'];
  20. var  wordlistAry4=['1d.js'];
  21. var  wordlistAry5=['1e.js'];
  22. var  wordlistAry6=['1f.js'];
  23. var  wordlistAry7=['1g.js'];
  24. var  wordlistAry8=['1h.js'];
  25. var  wordlistAry9=['1i.js'];
  26. var  wordlistAry10=['1j.js'];
  27. var  wordlistAry11=['1k.js'];
  28. var  wordlistAry12=['1l.js'];
  29.  
  30.  
  31. // The Default Image Path
  32. var var  wordlistPath='http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/';
  33.  
  34. var UseAry=var  wordlistAry; // the default var  wordlist Array
  35.  
  36.  
  37. var SelAry=[];
  38. // Each field is an array defining an option
  39. // field 0 = the text to be displayed in the option
  40. // field 1 = the directory path for the images (JS in this case)
  41. // field 2 = the image file names] (Array = 1A or 1B or 1C, etc.)
  42. SelAry[0]=[];
  43. SelAry[1]=['DE 1A','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry];
  44. SelAry[2]=['DE 1B','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry2];
  45. SelAry[3]=['DE 1C','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry3];
  46. SelAry[4]=['DE 1D','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry4];
  47. SelAry[5]=['DE 1E','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry5];
  48. SelAry[6]=['DE 1F','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry6];
  49. SelAry[7]=['DE 1G','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry7];
  50. SelAry[8]=['DE 1H','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry8];
  51. SelAry[9]=['DE 1I','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry9];
  52. SelAry[10]=['DE 1J','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry10];
  53. SelAry[11]=['DE 1K','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry11];
  54. SelAry[12]=['DE 1L','http://www.globalwritersclub.com/gaming/2/word/evapbook/eb/de/js/',wordlistAry12];
  55.  
  56. </script>
  57.  
  58. </HEAD>
  59.  
  60. <body onLoad="reset(); return true;">
  61.  
  62. <table border="0" cellpadding="0" cellspacing="0" width="100%" Summary="NAV TABLE">
  63. <tr><td>
  64. <input type="text" id="Name" value="" size="20" class="TxtArea"  ><br>
  65. <select id="Selectwordlist" onchange="Chgwordlist(this);" class="TxtArea"  >
  66. <option >Select wordlist</option>
  67.  
  68. </select>
  69. </td></tr> 
  70.  
  71. <tr>
  72. <td class="tcp">
  73.  
  74. <br>
  75. The Book Rescue
  76. <br>
  77. Plug in your guesses below!<br>
  78. You have 12 guesses.
  79. <br>&nbsp;<br>
  80.  
  81. <img src="/gaming/2/word/evapbook/12/hmstart.gif" height="230" width="266" name="hm" alt="Image used to display stages of errors."> 
  82.  
  83. <form name="game">
  84. <p><center>
  85. Display Word: <input type="text" name="displayWord"><br>
  86. Used Letters: <input type="text" name="usedLetters"> </center></p>
  87. </form>
  88.  
  89. <p><center>
  90. <a href="javascript:selectLetter('a');" onclick="this.style.color='#ff0000'">a</a> |
  91. <a href="javascript:selectLetter('ä');" onclick="this.style.color='#ff0000'">ä</a> |
  92. <a href="javascript:selectLetter('b');" onclick="this.style.color='#ff0000'">b</a> | 
  93. <a href="javascript:selectLetter('c');" onclick="this.style.color='#ff0000'">c</a> | 
  94. <a href="javascript:selectLetter('d');" onclick="this.style.color='#ff0000'">d</a> | 
  95. <a href="javascript:selectLetter('e');" onclick="this.style.color='#ff0000'">e</a> | 
  96. <a href="javascript:selectLetter('f');" onclick="this.style.color='#ff0000'">f</a> | 
  97. <a href="javascript:selectLetter('g');" onclick="this.style.color='#ff0000'">g</a> | 
  98. <a href="javascript:selectLetter('h');" onclick="this.style.color='#ff0000'">h</a> | 
  99. <a href="javascript:selectLetter('i');" onclick="this.style.color='#ff0000'">i</a> | 
  100. <a href="javascript:selectLetter('j');" onclick="this.style.color='#ff0000'">j</a> | 
  101. <a href="javascript:selectLetter('k');" onclick="this.style.color='#ff0000'">k</a> | 
  102. <a href="javascript:selectLetter('l');" onclick="this.style.color='#ff0000'">l</a>
  103. <a href="javascript:selectLetter('m');" onclick="this.style.color='#ff0000'">m</a>
  104. <a href="javascript:selectLetter('n');" onclick="this.style.color='#ff0000'">n</a> | <br />
  105. <a href="javascript:selectLetter('o');" onclick="this.style.color='#ff0000'">o</a> | 
  106. <a href="javascript:selectLetter('ö');" onclick="this.style.color='#ff0000'">ö</a> | 
  107. <a href="javascript:selectLetter('p');" onclick="this.style.color='#ff0000'">p</a> | 
  108. <a href="javascript:selectLetter('q');" onclick="this.style.color='#ff0000'">q</a> | 
  109. <a href="javascript:selectLetter('r');" onclick="this.style.color='#ff0000'">r</a> | 
  110. <a href="javascript:selectLetter('s');" onclick="this.style.color='#ff0000'">s</a> | 
  111. <a href="javascript:selectLetter('t');" onclick="this.style.color='#ff0000'">t</a> | 
  112. <a href="javascript:selectLetter('u');" onclick="this.style.color='#ff0000'">u</a> | 
  113. <a href="javascript:selectLetter('ü');" onclick="this.style.color='#ff0000'">ü</a> |
  114. <a href="javascript:selectLetter('v');" onclick="this.style.color='#ff0000'">v</a> | 
  115. <a href="javascript:selectLetter('w');" onclick="this.style.color='#ff0000'">w</a> | 
  116. <a href="javascript:selectLetter('x');" onclick="this.style.color='#ff0000'">x</a> | 
  117. <a href="javascript:selectLetter('y');" onclick="this.style.color='#ff0000'">y</a> | 
  118. <a href="javascript:selectLetter('z');" onclick="this.style.color='#ff0000'">z</a> </center> </p>
  119. <p> 
  120. <a href="javascript:reset()">Start game / Reset game</a></p>
  121. </table>
  122. </body>
  123. </html>
  124.  
  125.  
Mar 9 '10 #2

tpgames
100+
P: 785
I realize that with the amount of brain damage I have, I should really try something easier, like knitting. But, can anyone tell me what search terms might help me? Or, can someone point me to the code that I'm missing? Thanks! :D

My issue is that I can not figure out how to do the code bit that tells the computer what to do with the JS selection. I'm sure I can get the code to post the JS in a window, but that is not what I want. The code snippet I do have, make a playing field, for memory. This is not very useful. I have the complete code for the game, I just need the computer to use the JS file for the game and the HTML file for the other half of the game code and marry the 2. I thought that document.write wouldn't do it, as it would just print whatever instead of do whatever.
Thanks!
Mar 11 '10 #3

tpgames
100+
P: 785
My question I'd still like an answer to is:
1) What search terms does one use to figure out how to marry input choice with html page to get the js file chosen to be put into the html page. I would like to read more about this, but my search terms do not quite give me the write resources. All I get is how to make drop down navigation menus. :P

I did come up with a very silly, very newbie solution. Write the entire HTML page in JS such that one uses if else else else statements for all the possible choices. In this case, 1 IF and 11 else statements. Thus, if selection is 1a.js, then document write statement would be the javascript link to 1a.js file.

I'd still use the drop down menu for choices, but I'm not exactly sure if there is a line I need between the drop down menu and the if else statement.

2) My other question:

Given the newbie solution above, what is the "proper search terms" that will give me the right article to read that would help me with the newbie type solution?
Thanks!

signed perplexed who is researching how to write an HTML page completely in JS, a solution I was trying to avoid!

Yes, I'm communicating with myself. No problem, I did manage to connect with the solution to my other problem, thus didn't need a response. :D People are busy, and I'm fine with that.


Naysayers:
Believe it or not, I do wait a considerable amount of time before I post my questions. Matter of a fact, I won't be posting much JS questions only because I'm just beginning to connect with the language. Give it another year. Many of the questions I do have, I feel should wait until I've worked out at least the direction I should be searching in.
Many thanks! :D
Mar 17 '10 #4

tpgames
100+
P: 785
I finally got drop down menu out of my head (which was why I asked for search terms), and finally found JS for Beginners, and wrote this (which does not work). I still think that there is something I'm not reading, and need to read. The code is my own slaughtering of JS. ;)

Expand|Select|Wrap|Line Numbers
  1. <SCRIPT LANGUAGE="JavaScript"> <!--
  2. function mychoice()
  3.  
  4. if {(mychoice = "1a") then (document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1a.js"></script>');
  5. }
  6. else
  7. {(mychoice = 1b) then (document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1b.js"></script>');
  8. }
  9. else
  10. {(mychoice = 1c) then (document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1c.js"></script>');
  11. }
  12. else
  13. {(mychoice = 1d) then (document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1d.js"></script>');
  14. }
  15. else
  16. (mychoice = 1e) then (document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1e.js"></script>');
  17. -->
  18. </script>
  19. <form>
  20. <input type="checkbox" name="mychoice" value="1a" onclick="mychoice()"> 1A <br>
  21. <input type="checkbox" name="mychoice" value="1b" onclick="mychoice()"> 1B <br>
  22. <input type="checkbox" name="mychoice" value="1c" onclick="mychoice()"> 1C <br>
  23. <input type="checkbox" name="mychoice" value="1d" onclick="mychoice()"> 1D <br>
  24. <input type="checkbox" name="mychoice" value="1e" onclick="mychoice()"> 1E <br>
  25.  
  26. </form> 
  27.  
Mar 19 '10 #5

tpgames
100+
P: 785
Forget the code I just posted. I forgot to fix the "then". I've got this code all wrong and I know it, but don't know how to fix it. Apparently, I'm still getting lost with the brackets and if else statements. I did finally figure out some search terms to use - document objects, and if/else statements. Originally, the previous search terms was what I was looking for. Now however that I found the search terms, and came up with the following catastrophe, what next? Thanks!

Expand|Select|Wrap|Line Numbers
  1. <SCRIPT LANGUAGE="JavaScript"> <!--
  2. function mychoice()
  3.  
  4. if (mychoice = "1a") {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1a.js"></script>');
  5. }
  6. else
  7. (mychoice = 1b) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1b.js"></script>');
  8. }
  9. else
  10. (mychoice = 1c) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1c.js"></script>');
  11. }
  12. else
  13. (mychoice = 1d) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1d.js"></script>');
  14. }
  15. else
  16. (mychoice = 1e) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1e.js"></script>');
  17. }
  18. -->
  19. </script>
  20. <form>
  21. <input type="checkbox" name="mychoice" value="1a" onclick="mychoice()"> 1A <br>
  22. <input type="checkbox" name="mychoice" value="1b" onclick="mychoice()"> 1B <br>
  23. <input type="checkbox" name="mychoice" value="1c" onclick="mychoice()"> 1C <br>
  24. <input type="checkbox" name="mychoice" value="1d" onclick="mychoice()"> 1D <br>
  25. <input type="checkbox" name="mychoice" value="1e" onclick="mychoice()"> 1E <br>
  26. </form> 
  27. <tr>
  28. <td class="ctr">
  29.  
  30.   <br />
  31.  
  32.   <span id="board"></span>
  33.     <br /><br />
  34.     <span id="assemble"></span>
  35.     <br />
  36.     <br />
  37.         <span id="theWord"></span>
  38.     <form>
  39. <br />
  40.     <input type="button" value="^-^ ?" onclick="showWord();" />
  41.  
  42.    <b style="visibility:hidden">__</b>
  43.     <input type="button" value="Start!" onclick="javascript:history.go(0);" />
  44.  
  45.     </form>
  46.  
  47. </td>
  48. </table>
  49.  
  50.  
Mar 19 '10 #6

tpgames
100+
P: 785
Last thing I tried is this, and this time I'm posting the entire code because the Start doesn't even begin to communicate with the choice given by the user. I had meant to use else if statements, as I have 5 choices. Eventually, I'll have choices 1A - 1L, but thought 5 would be good for starters to figure out the code.
Thanks!
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title> Scrambled Words </title>
  5.  
  6. <META http-equiv="expires" content="Thur, 1 March 2007 13:00:00 GMT">
  7. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  8. <link type="text/css" rel="stylesheet" 
  9. href="http://www.globalwritersclub.com/gaming/2/word/scrambled/css/scrambled.css"> 
  10.  
  11. <!--script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1a.js"--></script>
  12. <link rel="shortcut icon" href="http://www.globalwritersclub.com/gwc/img/gwcicon.gif">
  13.  
  14.  
  15.  
  16.  
  17.  
  18. <style type="text/css">
  19. <!--
  20. body {
  21.           text-align:center;
  22.          }
  23. a.scramble {
  24.                        color:#9D23EB;
  25.                          font-weight:bold;
  26.                          font-size:30;
  27.                          position:relative;
  28.                      }
  29. span#assemble {
  30.                          font-weight:bold;
  31.                          font-size:30;
  32.                          position:relative;
  33.                          }
  34. span#theWord {
  35.                          color:#0000ff;
  36.                          background-color:#000000;
  37.                          font-weight:bold;
  38.                          font-size:30;
  39.                          position:relative;
  40.                          border:2 inset gray;
  41.                          }
  42. a:hover {
  43.                   background-color:#000000;
  44.                     color:#0000ff;
  45.                 }
  46. -->
  47. </style>
  48.  
  49. </head>
  50. <body>
  51.  
  52. <table border="2" align="center" width="100%" cellpadding="5" border="2">
  53. <tr><td>
  54.  
  55. <SCRIPT LANGUAGE="JavaScript"> <!--
  56. function mychoice()
  57.  
  58. if {(mychoice = "1a") {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1a.js"></script>');
  59. }
  60. }
  61. else if {
  62. (mychoice = 1b) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1b.js"></script>');
  63. }
  64. }
  65. else if {
  66. (mychoice = 1c) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1c.js"></script>');
  67. }
  68. }
  69. else if {
  70. (mychoice = 1d) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1d.js"></script>');
  71. }
  72. }
  73. else {
  74. (mychoice = 1e) {(document.write'<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1e.js"></script>');
  75. }
  76. }
  77. -->
  78. </script>
  79. <form>
  80. <input type="checkbox" name="mychoice" value="1a" onclick="mychoice()"> 1A <br>
  81. <input type="checkbox" name="mychoice" value="1b" onclick="mychoice()"> 1B <br>
  82. <input type="checkbox" name="mychoice" value="1c" onclick="mychoice()"> 1C <br>
  83. <input type="checkbox" name="mychoice" value="1d" onclick="mychoice()"> 1D <br>
  84. <input type="checkbox" name="mychoice" value="1e" onclick="mychoice()"> 1E <br>
  85. </form> 
  86.  
  87.  
  88. <script>
  89. <!-- 
  90. <input type="checkbox" name="mychoice" value="1f" onclick="mychoice()"> 1F <br>
  91. <input type="checkbox" name="mychoice" value="1g" onclick="mychoice()"> 1G <br>
  92. <input type="checkbox" name="mychoice" value="1h" onclick="mychoice()"> 1H <br>
  93. <input type="checkbox" name="mychoice" value="1i" onclick="mychoice()"> 1I <br>
  94. <input type="checkbox" name="mychoice" value="1j" onclick="mychoice()"> 1J <br>
  95. <input type="checkbox" name="mychoice" value="1k" onclick="mychoice()"> 1K <br>
  96. <input type="checkbox" name="mychoice" value="1l" onclick="mychoice()"> 1L <br>
  97. -->
  98. </script>
  99. <tr>
  100. <td class="ctr">
  101.  
  102.   <br />
  103.  
  104.   <span id="board"></span>
  105.     <br /><br />
  106.     <span id="assemble"></span>
  107.     <br />
  108.     <br />
  109.         <span id="theWord"></span>
  110.     <form>
  111. <br />
  112.     <input type="button" value="^-^ ?" onclick="showWord();" />
  113.  
  114.    <b style="visibility:hidden">__</b>
  115.     <input type="button" value="Start!" onclick="javascript:history.go(0);" />
  116.  
  117.     </form>
  118.  
  119. </td>
  120. </table>
  121. </body>
  122. </html>
  123.  
Mar 19 '10 #7

tpgames
100+
P: 785
Fixed some obvious errors. :D I know there are many more errors, but this is what I've got. Any other errors I don't see yet. I'm not reposting the entire page as I am convinced that out of the box this script is all wrong! Currently, I am reading forms and JavaScript, plus writing HMTL in JS.
Any suggestions greatly appreciated. I'll check back in here tomorrow, as I'm still talking with myself. However, MANY people need help, and I only wish I was a better programmer. Even my HTML is 4.01 and outdated. lol

Expand|Select|Wrap|Line Numbers
  1. <SCRIPT LANGUAGE="JavaScript"> <!--
  2. function myChoice()
  3.  
  4. if(myChoice = "1a") {
  5. document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1a.js"></script>');
  6. }
  7.  
  8. else if {
  9. (myChoice = "1b") {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1b.js"></script>');
  10. }
  11. }
  12. else if {
  13. (myChoice = 1c) {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1c.js"></script>');
  14. }
  15. }
  16. else if {
  17. (myChoice = 1d) {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1d.js"></script>');
  18. }
  19. }
  20. else {
  21. (myChoice = 1e) {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1e.js"></script>');
  22. }
  23. }
  24. -->
  25. </script>
  26. <form>
  27. <input type="checkbox" name="myChoice" value="1a" onclick="myChoice(1a)"> 1A <br>
  28. <input type="checkbox" name="myChoice" value="1b" onclick="myChoice(1b)"> 1B <br>
  29. <input type="checkbox" name="myChoice" value="1c" onclick="myChoice(1c)"> 1C <br>
  30. <input type="checkbox" name="myChoice" value="1d" onclick="myChoice(1d)"> 1D <br>
  31. <input type="checkbox" name="myChoice" value="1e" onclick="myChoice(1e)"> 1E <br>
  32. </form> 
  33.  
  34.  
Mar 20 '10 #8

tpgames
100+
P: 785
Question: Should I bump this thread every 10 hours???? Someone posted 1 day ago and already got help! I've post SEVEN DAYS AGO and am talking with myself. Oops! o_O O_o :D
Mar 20 '10 #9

tpgames
100+
P: 785
Latest bit I've tried. What happens is nothing. I need it to actually show the word and use the JS file that was chosen. The on click show word does nothing. I'm not sure how to fix that, or what else I have wrong. Thanks!
(I think I'm done tinkering with this code, as I don't know what else to reread. I'm just glad that my brain is finally connecting this far. ) thanks!

Expand|Select|Wrap|Line Numbers
  1.  
  2. <table border="2" align="center" width="100%" cellpadding="5" border="2">
  3. <tr><td>
  4.  
  5. <SCRIPT LANGUAGE="JavaScript"> <!--
  6.  
  7. function myChoice()
  8.  
  9. if(myChoice = 1a) {
  10. document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1a.js"></script>');
  11. }
  12.  
  13. else if {
  14. (myChoice = 1b) {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1b.js"></script>');
  15. }
  16. }
  17. else if {
  18. (myChoice = 1c) {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1c.js"></script>');
  19. }
  20. }
  21. else if {
  22. (myChoice = 1d) {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1d.js"></script>');
  23. }
  24. }
  25. else {
  26. (myChoice = 1e) {document.write('<script language="Javascript" src="http://www.globalwritersclub.com/gaming/2/word/scrambled/de/js/1e.js"></script>');
  27. }
  28. }
  29. -->
  30. </script>
  31. <form>
  32. <input type="checkbox" name="1a" value="1a" onclick="myChoice(form.1a.value)"> 1A <br>
  33. <input type="checkbox" name="1b" value="1b" onclick="myChoice(form.1b.value)"> 1B <br>
  34. <input type="checkbox" name="1c" value="1c" onclick="myChoice(form.1c.value)"> 1C <br>
  35. <input type="checkbox" name="1d" value="1d" onclick="myChoice(form.1d.value)"> 1D <br>
  36. <input type="checkbox" name="1e" value="1e" onclick="myChoice(form.1e.value)"> 1E <br>
  37. </form> 
  38.  
  39.  
  40.  
  41. <tr>
  42. <td class="ctr">
  43.  
  44.   <br />
  45.  
  46.   <span id="board"></span>
  47.     <br /><br />
  48.     <span id="assemble"></span>
  49.     <br />
  50.     <br />
  51.         <span id="theWord"></span>
  52.     <form>
  53. <br />
  54.     <input type="button" value="^-^ ?" onclick="showWord();" />
  55.  
  56.    <b style="visibility:hidden">__</b>
  57.     <input type="button" value="Start!" onclick="javascript:history.go(0);" />
  58.  
  59.     </form>
  60.  
  61. </td>
  62. </table>
  63.  
Mar 21 '10 #10

gits
Expert Mod 5K+
P: 5,390
basicly when you use document.write() after page load the dom is corrupted and the page will be destroyed ...

as you might see from the scripts that you want to include ... they rely on a window.onload() event which is only fired once the page loads ...

so you would need to eval the scripts explicitly and then call the main() method ...

kind regards
Mar 21 '10 #11

tpgames
100+
P: 785
Is there a better way to do this entire code such that eval function does not need to be used? I've found 2 different websites that say eval function is too easily hacked and not recommended if one can't trust the users.

Also, can you recommend what I should be reading? I am still very confused by everything.
Thanks!
Mar 22 '10 #12

gits
Expert Mod 5K+
P: 5,390
most secure way would be to post the selection back to the server and include the correct js file and then send back the right page to the client ... when you want to add js code dynamically on a page you cannot avoid eval ...
Mar 22 '10 #13

tpgames
100+
P: 785
Here was a solution that someone else game me.
Expand|Select|Wrap|Line Numbers
  1. <script language="Javascript"> 
  2. var words = [     
  3. ["sink","toilet","soap","bathtub","faucet","towel","sponge","washcloth","toiletpaper","water","toothpaste","toothbrush"],
  4. ["mirror","bed","dresser","sheets","comforter","blanket","comb","brush","closet","pillow","clock","lamp"],
  5. ["lightswitch","key","car","train","airplane","bike","dustpan","truck","bus","outlet","drawer","lightbulb"], 
  6. ];
  7. var word;
  8. var letter; 
  9. var rand;
  10. var actual;
  11. function game(which)
  12. {
  13.        // clear out board and assemble first:
  14.        var span = document.getElementById('board');
  15.        while ( span.childNodes.length > 0 )
  16.        {
  17.            span.removeChild(span.firstChild);
  18.        }
  19.        var span = document.getElementById('assemble');
  20.        while ( span.childNodes.length > 0 )
  21.        {
  22.            span.removeChild(span.firstChild);
  23.        }
  24.        document.getElementById('theWord').innerHTML = "";
  25.        letter = new Array( );
  26.  
  27.        // NOW start new game:
  28.        wordset = words[which];
  29.        word = wordset[ Math.floor(Math.random()*wordset.length) ];
  30.        scrambleWord();
  31.        creatWord();
  32. }
  33. function scrambleWord()
  34. {
  35.  actual=word;
Then the snippet of the HTML code needed is this...

Expand|Select|Wrap|Line Numbers
  1. <a href="#" onclick="game(1);return false;"> 1D - F </a> &nbsp; |
  2. <a href="#" onclick="game(2);return false;"> 1G - I </a> &nbsp; |
  3. <a href="#" onclick="game(3);return false;"> 1J - L </a> &nbsp; ||
  4. </form> 
  5.  
  6.  
  7.  
  8. <tr>
  9. <td class="ctr">
  10.  
  11.   <br />
  12.  
  13.   <span id="board"></span>
  14.     <br /><br />
  15.     <span id="assemble"></span>
  16.     <br />
  17.     <br />
  18.         <span id="theWord"></span>
  19.     <form>
  20. <br />
  21.     <input type="button" value="^-^ ?" onclick="showWord();" />
  22.     </form>
  23.  
This works for as many games as you want to put on one page. It does put all of the JS on the same page as the HTML, but I can live with that. I'm studying this code to see if I can convert the Hangman code to have this feature.
Thanks!
Apr 8 '10 #14

Post your reply

Sign in to post your reply or Sign up for a free account.