JavaScript - Higher Or Lower Button
I'm trying to make a higher or lower game but I can't seem to get the higher and lower buttons to work. I have my deck set up in an array such as
Code: var deck = [ {pictu "images/AceHearts.png", facevalue: 1 }, {pictu "images/2Hearts.png", facevalue: 2 }, etc. ] <!-- Then the rest of my code is as follows> function rnd() { return Math.random()-0.5; } function hidemessage(){ document.getElementById("winningmessage").style.display = "none"; } hand1 = new Array(); deck.sort(rnd); <!-- This function randomly picks a card and takes its value and returns it --!> function getHandHTML(hand) { html= ""; total = 0; for (i=0; i<hand.length; i++) { html+= "<img src = \""+ hand[i].picture +"\"> "; total= hand[i].facevalue; } return html; } <!-- This function takes a card from the deck --!> function nextcard() { for (i=0; i< 1; i++) { card = deck.shift(); hand1.push(card); } document.getElementById('hand1').innerHTML = getHandHTML(hand1); document.getElementById("winningmessage").style.display = "none"; } <!-- This function adds takes the next card from the deck and places it on the screen --!> <!--It also disables the buttons after 6 cards have been drawn --!> function addCardToHand() { card = deck.shift(); if (card == null) { return;} hand1.push(card); document.getElementById('hand1').innerHTML = getHandHTML(hand1); if(i==6){ document.getElementById("higher").disabled = true; document.getElementById("lower").disabled = true; document.getElementById("winningmessage").style.display = "block"; } } window.onload = nextcard; function higher(){ if (hand1[index].facevalue() > hand1[index-1].facevalue()) { alert("higher"); } else { alert("wrong") } } </script> <body> <style> .hand {margin: 20px; padding: 20px;} </style> <input type = button value = "higher" onclick = "addCardToHand();higher()" id = higher> <input type = button value = "lower" onclick = "addCardToHand()" id = lower> <div class = hand id = hand1></div> <div id = "winningmessage"> You Win </div> </body> </html> I've highlighted the area where I've attempted to make an alert box pop up saying if the higher button was right or wrong. Any suggestions would be much appreciated Similar TutorialsAll, I have a script that runs some jQuery and appends it to a <div>. I only want this script executed if a user is using IE7 or higher since jQuery doesn't work with IE6. How can I do that? Also, if they aren't using IE7 or higher I don't wnat to display the <div> that the results go into. How would I go about doing this? Thanks! Lets say I have a MySQL value of 4... and I have a HTML INPUT field.. Is there a way to make it so that if a client tries to submit a value higher than 4, then they will be returned a message? Something like: Code: <SCRIPT type="text/javascript"> function validateForm() { if (document.forms["form"]["quantity"].value== (+$row['quantity']) { alert ("Cannot submit because the quantity specified is not available."); return false; } } </SCRIPT> <INPUT name="quantity" onsubmit="return validateForm()> Can someone please tell me where in IE 8 I can configure Javascript to Raise and Lower windows? Thanks Hello. I need to manipulate with a upper and lower case on STRINGS For example I have string: Code: LALA_KAKA_mama_WIWI I need to conwert it to Code: Lala_kaka_mama_wiwi with first letter upper case. Is it one simple way to do it with JS script/code? Best Regards Seniors Plz help me resolve a little problem i.e. i need to enter either capital or small letter the input should be accepted. The code is written below: Plz help me solve this. var Alphabet; Alphabet= prompt("Enter an Alphabet"); if(Alphabet == "a" || Alphabet == "e" || Alphabet == "i" || Alphabet == "o" || Alphabet == "u") { document.write("This is a Vowel" + " " + Alphabet); } else { document.write("This is a Consonent" + " " + Alphabet); } Thanks hi everybody, i'm using JSE client-side site search engine to search in my page.. and this is the code: Code: var cookies = document.cookie; var p = cookies.indexOf("d="); if (p != -1) { var st = p + 2; var en = cookies.indexOf(";", st); if (en == -1) { en = cookies.length; } var d = cookies.substring(st, en); d = unescape(d); } var od = d; var m = 0; if (d.charAt(0) == '"' && d.charAt(d.length - 1) == '"') { m = 1; } var r = new Array(); var co = 0; if (m == 0) { var woin = new Array(); var w = d.split(" "); for (var a = 0; a < w.length; a++) { woin[a] = 0; if (w[a].charAt(0) == '-') { woin[a] = 1; } } for (var a = 0; a < w.length; a++) { w[a] = w[a].replace(/^\-|^\+/gi, ""); } a = 0; for (var c = 0; c < s.length; c++) { pa = 0; nh = 0; for (var i = 0; i < woin.length; i++) { if (woin[i] == 0) { nh++; var pat = new RegExp(w[i], "i"); var rn = s[c].search(pat); if (rn >= 0) { pa++; } else { pa = 0; } } if (woin[i] == 1) { var pat = new RegExp(w[i], "i"); var rn = s[c].search(pat); if (rn >= 0) { pa = 0; } } } if (pa == nh) { r[a] = s[c]; a++; } } co = a; } if (m == 1) { d = d.replace(/"/gi, ""); var a = 0; var pat = new RegExp(d, "i"); for (var c = 0; c < s.length; c++) { var rn = s[c].search(pat); if (rn >= 0) { r[a] = s[c]; a++; } } co = a; } function return_query() { document.jse_Form.d.value = od; } function num_jse() { document.write(co); } function out_jse() { if (co == 0) { document.write('Your search did not match any documents.<p>Make sure all keywords are spelt correctly.<br>Try different or more general keywords.'); return; } for (var a = 0; a < r.length; a++) { var os = r[a].split("^"); if (bold == 1 && m == 1) { var br = "<b>" + d + "</b>"; os[2] = os[2].replace(pat, br); } if (include_num == 1) { document.write(a + 1, '. <a href="', os[1], '">', os[0], '</a><br>', os[2], '<p>'); } else { document.write('<a href="', os[1], '">', os[0], '</a><br>', os[2], '<p>'); } } } i got it from http://www.javascriptkit.com/script/...se/index.shtml but, in turkish alphabet the uppercase of "i" is "İ" with a dot.. and the lowercase of "I" is "ı" without a dot.. when i use the code above, it doesn't find "TEFSİR" if the user type it in lowercase as "tefsir".. also doesn't find "Bayraklı" if the user type it all in uppercase as "BAYRAKLI" is there a way to make this work? Hey guys. This is vague because I dont know what exactly to tell you but please reply with me so I can fix this. I want to add something to my forum. Specifically, I want to add a HTML and Picture button for when you go to reply. Like posting an article here, there are also these options (font, alignment, insert image) I do not know how to achieve this but shouldnt be too hard. Here are the two sources you will need to look through to help me fix the forum. http://neoweather.com/FWFORUM.JS http://static.websimages.com/JS/fw.js THANKS Hey guys. I want to add something to my forum. Specifically, I want to add a HTML and Picture button for when you go to reply. Like posting an article here, there are also these options (font, alignment, insert image) I do not know how to achieve this but shouldnt be too hard. Here are the two sources you will need to look through to help me fix the forum. http://neoweather.com/FWFORUM.JS http://static.websimages.com/JS/fw.js THANKS Hi, I am not entirely sure what I am doing wrong here, and I have been looking at this for ages, so apologies in advance if I have become so bleary eyed I can't see something simple. I use php to create buttons based on values pulled for a table. The problem I have is when you click on the first button the javascript function works great, when you click on the next button you get the same output even though it should be different results. I am working in ff and I can see on my firebug console that the javascript function is being called, but it is not passing the new value of the second or third button, it just keeps repassing the value of the first button. So not entirely sure where I am going wrong here. My page is: Code: <script type="text/javascript"> function loadXMLDoc2(File,ID,Msg){ if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { try{ xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } var params=Msg; xmlhttp.open("POST",File,true); xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache"); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlhttp.setRequestHeader("Content-length", params.length); xmlhttp.setRequestHeader("Connection", "close"); xmlhttp.send(params); } </script> <head> <body> <?php $con = mysql_connect("localhost","user","password"); if (!$con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("mydb", $con); $result = mysql_query("SELECT DISTINCT theme FROM goods WHERE category='{$_POST['category']}' ORDER BY theme DESC"); while($row = mysql_fetch_array($result)){ echo '<input type="text" class="hidden" name="theme" id="theme" value="' . $row['theme'] . '" ><input type="button" class="button3" name="product" id="product" value="' . $row['product'] . '" onClick="loadXMLDoc2(\'getShow.php\',\'txtHint\',\'theme=\'+encodeURI(document.getElementById(\'rtheme\').value))" > '; } echo '<br /><br /> <div id="txtHint"><div> <br /> <br />'; mysql_close($con); ?> And getShow.php produces a table with a list of product images, names and prices, based on theme. So basically not sure where I am going wrong here? i'm still a relative noob and this has me stuck - i have a save button with a "save as copy" in the save dropdown list. add new item directs to a premade/formatted project that is used as a template, so on that item i only want/need the "save as copy" but on all other items that use the form i need to only have the "save" function. is there any way to either change the function of the button depending on item that is being viewed in the edit screen OR hide the "save" button and only show the button associated with "save as copy - and vis versa for the rest of the items?? current button code is - protected function getToolbar() { $options = array(); $user = JFactory::getUser(); $create_ms = $user->authorise('core.create', 'com_pfmilestones'); $create_task = $user->authorise('core.create', 'com_pftasks'); $options[] = array( 'text' => 'JSAVE', 'task' => $this->getName() . '.save'); $options[] = array( 'text' => 'Save as new project', 'task' => $this->getName() . '.save2copy', 'options' => array('access' => ($this->item->id > 0))); PFToolbar::dropdownButton($options, array('icon' => 'icon-white icon-ok')); item used as template is id=8 any help or suggestions would be greatly appreciated.. i got javascripts button : Code: <input type="button" value="select" onClick="document.getElementById('input').select()" /> how can i transform "button" to image button (gif) I have 4 rows in a table. Each row consist of 4 radio buttons. Each radio button per row has different values in it but has the same name (group) ex: <input type="radio" name="a" value="1"> <input type="radio" name="a" value="2"> <input type="radio" name="a" value="3"> <input type="radio" name="a" value="4"> <input type="radio" name="b" value="1"> <input type="radio" name="b" value="2"> <input type="radio" name="b" value="3"> <input type="radio" name="b" value="4"> and so on.. If I click radio button A with value 2, I want to output the total at the bottom as "2".. Also, if I click radio button B with value 3, I want to output the total of A and B as 5 and so on.. How can I automatically calculate the answer based on which radio button was click? update: I got my answer from this site: http://stackoverflow.com/questions/1...s-using-jquery i am trying to make a button which is a .gif that will change when a mouse over occurs and a animation will occur when click then will relocate to a new page but i am getting multiple images at the same time pleas help. Code: <html> <body> <img src="Jepordy/Fla files/Button set 1.gif" > <img name="jsbutton" src="Jepordy/Fla files/Button set 1.gif" width="550" height="400" border="0" alt="javascript button"> <SCRIPT language="JavaScript"> var myimgobj = document.images["jsbutton"]; </SCRIPT> <A href="#" onMouseOver="return changeImage()" ><img name="jsbutton" src="Jepordy/Fla files/Button mouse over.gif" width="550" height="400" border="0" alt="javascript button"></A> <SCRIPT language="JavaScript"> function changeImage() { document.images["jsbutton"].src= "C:\Documents and Settings\fus10n\Desktop\Jepordy\Fla files\Button mouse over.gif"; return true; } </SCRIPT> <A href="#" onMouseOver="return changeImage()" onMouseOutwidth="550" height="400" border="0" alt="javascript button"= "return changeImageBack()" onMouseDown="return handleMDown()" onMouseUp="return handleMUp()" ><img name="jsbutton" src="Jepordy/Fla files/Button set 1.gif" width="550" height="400" border="0" alt="javascript button"></A> <SCRIPT language="JavaScript"> function changeImage() { document.images["jsbutton"].src= "C:\Documents and Settings\fus10n\Desktop\Jepordy\Fla files\Button set 1.gif"; return true; } function changeImageBack() { document.images["jsbutton"].src = "C:\Documents and Settings\fus10n\Desktop\Jepordy\Fla files\Button set 1.gif"; return true; } function handleMDown() { document.images["jsbutton"].src = "C:\Documents and Settings\fus10n\Desktop\Jepordy\Fla files\Button set 1.gif"; return true; } function handleMUp() { changeImage(); return true; } </SCRIPT> <A href="QUESTION LOCATION FOR THIS BUTTON GOES HERE!" onMouseOver="return changeImage()" onMouseOut= "return changeImageBack()" onMouseDown="return handleMDown()" onMouseUp="return handleMUp()"> <A href="http://www.javascript-coder.com/" onMouseOver="return changeImage()" onMouseOut= "return changeImageBack()" onMouseDown="return handleMDown()" onMouseUp="return handleMUp()" ><img name="jsbutton" src="Jepordy/Fla files/Button mouse over.gif" width="550" height="400" border="0" alt="javascript button"></A> </body> </html> i am trying to achieve a JS driven button for a cms. for example i have a text in a textarea so i select the text and add the bold attribute to this text. my text before : text my text with bold added : <b>text</b> what the function to achieve this ? thanks I have one button - can I attach two links to it. button <img src="images/aboutusbtn.gif" alt="ABOUT US" /> link 1 - javascript toggle button <a href="javascript://" name="toggle1" id="toggle1"></a> link 2 - anchor button <a href="#c1"></a> Cheers pjking I need an timed button. When you come to site, you must wait in that site ?? seconds and then button comes pressable.
http://www.javascriptkit.com/script/script2/alarm.shtml this example of source code i try how to do 2 button alarm in this source code 1 button set alarm, and 1 button off alarm, i want create all this button have timer... how? example: 1 button set on at 06 hour 00 minutes 00 second another button set off at 12 hour 00 minutes 00 second this is javascript document.getElementById("times").value=hours+":"+mins+":"+secs; if(timeral==true && hours==hvb && mins==mvb && secs==svb){ document.getElementById("onbtn").click(); } document.getElementById("times1").value=hours+":"+mins+":"+secs; if(timeral1==true && hours==hv && mins==mv && secs==sv){ document.getElementById("offbtn").click() ; } //////*****THIS FOR CHANGE IMAGE ******////// function corridoroff(){ document.getElementById("nyala").src="level2.jpg"; } function corridoron(){ document.getElementById("nyala").src="level2on.jpg"; } this is html <img id="nyala" src="level2.jpg" width="765" height="398" /> <input type="button" name="manualoff" id="onbtn" value="Manual OFF" onClick="do_portcontrol(1,0);corridoroff(); return false;"></td> <input type="button" name="manualon" id="offbtn" value="Manual ON" onClick="do_portcontrol(1,1);corridoron(); return false;"></td> **MY PROBLEM IS....how to put the id"nyala" into this button?? 2 elementbyid into one button? All: I need some help with a radio button code. It seems simple but I am really new at JavaScript so I need help. I have created a JavaScript code that has three radio buttons (High, Medium, and Low). When you click on high two text boxes appear so that an email address can be added. What I need help with is making the text boxes disappear if someone accidentally click high and then went back to low or medium. Currently the High button stays clicked and the text boxes still show. Any help would be great. Thanks, Stephen Code: <script type="text/javascript"> function showHide(el){ obj = document.getElementById(el).style; (obj.display == 'none')? obj.display = 'block' : obj.display = 'none'; } </script> <form id="form1" name="form1" method="post" action=""> <label> <input type="Checkbox" name="High" value="High" onclick="showHide('group1')" /> High </label> <label> <input type="Checkbox" name="Medium" value="Button" /> Mediun </label> <label> <input type="Checkbox" name="Medium" value="Button" /> Low </label> <p id="group1" style="display: none;"> <label> <b>friend1  </b><input type="Text" name="textGroup1" value="@gmail.com" /> <br/> </label> <br /> <label> <b>friend2  </b><input type="text" name="textGroup1" value="@gmail.com" /> </label> </p> </form> |