JavaScript - Button And Functions Help.
I'm tryingto make a button where, when you click the button, a variable will increase and refresh (reload the number displayed, but one number higher.
Here is what I have: Code: <html> <head> </head> <body> <script type="text/javascript"> x=1 document.write(x) </script> <input type="button" value="Up" onclick="document.write (++ x) "> <input type="button" value="Down" onclick="document.write (-- x)"> <input type="button" value="Reload" onclick="history.go(0)"> </body> </html> The problem with this is: When you hit the "up" button, everything on the page dissapears and it just outputs "2". All the buttons and stuff dissapear? There must be a better way to do it. And would I need to use a database. Any help? Similar TutorialsHi, I'm Trying Make A Simple Program To Flip A Coin (Using Math.random). Every-time I Open My Browser Running The Code, The Button, Appears, But When Clicked, Nothing Happens... :confused: Can't Figure Out Why, If Someone Could Help Me Fix This, And Tell Me What I've Done Wrong, That Would Be Great, Thanks... Code: Code: <DOCTYPE html> <html> <head> </head> <body> <button type="button" onclick="myFunction()">Start</button><br> <script> function myFunction(){ for( i = 0; i < 20; i++){ if(Math.random() > 0.5){ document.write(\n + 'Heads')} else{ document.write(\n + 'Tails')}}} </script> </body> </html> Hi I've set up an html page that contains 3 buttons, which have a sprite rollover effect when hovered over. This is handled by css. When one of the buttons is clicked - a value is passed to an input field. This is handled by Javascript. Both of these functions work. What I would like to do is add a second function when a button is clicked - so that the hover sprite remains selected. Could anyone tell me how to do this please? Here is the button code I have: <button type="button" class="fantasy_button_blue_sprite" id="mcgyver" value="mcgyver" onclick="setHiddenControlValue('option1');">next</button> Here is the input field that gets populated: <input type="<?php echo $type;?>" id="fantasy_friend" name="fantasy_friend" value="<?php echo $fantasy_friend; ?>"> This is the javascript I'm using: <!-- // set the hidden form field when a button is clicked function setHiddenControlValue(selectedValue) { document.getElementById("fantasy_friend").value = selectedValue; parent.document.options_form.their_firstname.value=selectedValue; } And this is the sprite css: .fantasy_button_green_sprite { background: transparent url("/images/align_page/fantasy_button1.jpg") 0 1px no-repeat; height:61px; width:164px; border:none; text-indent:-99999px; cursor: pointer; margin-top:20px; } .fantasy_button_green_sprite:hover { background: transparent url("/images/align_page/fantasy_button1.jpg") 0 -61px no-repeat; } Thanks! Tom --> Hey, I have a page at http://www.webdev70.cocc-webdev.org/contact.html where I have styling on the radio and check boxes. I'm working on another project for class now where I want onclick or onchange functions in the radio buttons. When the radio buttons have the class="styled" on them, the function will not execute. When that's removed, they do. Here is the javascript for the styling: Code: var checkboxHeight = "25"; var radioHeight = "25"; var selectWidth = "190"; document.write('<style type="text/css">input.styled { display: none; } select.styled { position: relative; width: ' + selectWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } .disabled { opacity: 0.5; filter: alpha(opacity=50); }</style>'); var Custom = { init: function() { var inputs = document.getElementsByTagName("input"), span = Array(), textnode, option, active; for(a = 0; a < inputs.length; a++) { if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].className == "styled") { span[a] = document.createElement("span"); span[a].className = inputs[a].type; if(inputs[a].checked == true) { if(inputs[a].type == "checkbox") { position = "0 -" + (checkboxHeight*2) + "px"; span[a].style.backgroundPosition = position; } else { position = "0 -" + (radioHeight*2) + "px"; span[a].style.backgroundPosition = position; } } inputs[a].parentNode.insertBefore(span[a], inputs[a]); inputs[a].onchange = Custom.clear; if(!inputs[a].getAttribute("disabled")) { span[a].onmousedown = Custom.pushed; span[a].onmouseup = Custom.check; } else { span[a].className = span[a].className += " disabled"; } } } inputs = document.getElementsByTagName("select"); for(a = 0; a < inputs.length; a++) { if(inputs[a].className == "styled") { option = inputs[a].getElementsByTagName("option"); active = option[0].childNodes[0].nodeValue; textnode = document.createTextNode(active); for(b = 0; b < option.length; b++) { if(option[b].selected == true) { textnode = document.createTextNode(option[b].childNodes[0].nodeValue); } } span[a] = document.createElement("span"); span[a].className = "select"; span[a].id = "select" + inputs[a].name; span[a].appendChild(textnode); inputs[a].parentNode.insertBefore(span[a], inputs[a]); if(!inputs[a].getAttribute("disabled")) { inputs[a].onchange = Custom.choose; } else { inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled"; } } } document.onmouseup = Custom.clear; }, pushed: function() { element = this.nextSibling; if(element.checked == true && element.type == "checkbox") { this.style.backgroundPosition = "0 -" + checkboxHeight*3 + "px"; } else if(element.checked == true && element.type == "radio") { this.style.backgroundPosition = "0 -" + radioHeight*3 + "px"; } else if(element.checked != true && element.type == "checkbox") { this.style.backgroundPosition = "0 -" + checkboxHeight + "px"; } else { this.style.backgroundPosition = "0 -" + radioHeight + "px"; } }, check: function() { element = this.nextSibling; if(element.checked == true && element.type == "checkbox") { this.style.backgroundPosition = "0 0"; element.checked = false; } else { if(element.type == "checkbox") { this.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px"; } else { this.style.backgroundPosition = "0 -" + radioHeight*2 + "px"; group = this.nextSibling.name; inputs = document.getElementsByTagName("input"); for(a = 0; a < inputs.length; a++) { if(inputs[a].name == group && inputs[a] != this.nextSibling) { inputs[a].previousSibling.style.backgroundPosition = "0 0"; } } } element.checked = true; } }, clear: function() { inputs = document.getElementsByTagName("input"); for(var b = 0; b < inputs.length; b++) { if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px"; } else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 0"; } else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px"; } else if(inputs[b].type == "radio" && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 0"; } } }, choose: function() { option = this.getElementsByTagName("option"); for(d = 0; d < option.length; d++) { if(option[d].selected == true) { document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue; } } } } window.onload = Custom.init; The code is way over my head so I'm not sure where the problem is, or if it could be fixed. This is what one of my radio buttons looks like: <input type="radio" name="puppy" value="1" class="styled" onchange="puppycheck()">Black and White Puppy If the style tag is removed it works perfectly. There is CSS too, but I don't think the problem is in there. Hi, This button changes the button text when clicked, but it is always calling the same function. How to make the button depending on the button text to call different functions on onclick? [CODE] <script type = "text/javascript"> function button_switch(){ if (document.switch_form.switch_b.value == "Adam"){ document.switch_form.switch_b.value="Eva"; } else{ document.switch_form.switch_b.value = "Adam"; } } </script> <form name = "switch_form"> <input type = "button" name = "switch_b" id = "switch_b" value = "Adam" onclick = "button_switch()" /> </form> [CODE] Hi, I have written a number of functions designed to return frequency data on 1000 randomly chosen numbers using different math functions for the rounding. I would like to include all of these functions within the wrapper of another function so that only one call is needed to get returns from all of the 'inner' functions. However, while each of the functions works in isolation, the moment I wrap them in another function they stop working. The following code is one of the functions 'frequencyWrapperOne' that has been wrapped in the function 'testWrapper'. A call to testWrapper does nothing. Can anyone see what I'm doing wrong? Code: function testWrapper() { function frequencyWrapperOne() { var numberArrayOne = new Array(0,0,0); for (var i = 0; i < 1000; i = i + 1) { var chosenNumber = Math.floor(Math.random() * 3); if (chosenNumber == 0) { numberArrayOne[0] = numberArrayOne[0] + 1; } if (chosenNumber == 1) { numberArrayOne[1] = numberArrayOne[1] + 1; } if (chosenNumber == 2) { numberArrayOne[2] = numberArrayOne[2] + 1; } } return window.alert(numberArrayOne.join(',')); } } testWrapper(); Thanks. Is there a way to activate a function from another function? It has to be in the script tag, it can't be in the HTML section. Can I use something similar to this following code? If not, can anyone give me some help? I have tried to do it various ways, and have looked it up a few times, but to no avail. Can I use something similar to this following code? If not, can anyone give me some help? if (condition) {activate functionname();} Any help I can get would be appreciated. Thanks a lot to anyone who can help. Ok here is what I have so far, my ending part of my Call Function I think is ok. for my main function. I think I misplaced the { and } I will show you all the codes I have for my main function this is what I have I think I did misplace something but I can not pin point where that one small things should be Code: unction showResults(race,name,party,votes) { // script element to display the results of a particular race var totalV = totalVotes(votes); document.write("<h2>" + race + "</h2>"); document.write("<table cellspacing='0'>"); document.write("<tr>"); document.write("<th>Candidate</th>"); document.write("<th class ='num'>Votes</th>"); document.write("<th class='num'>%</th>"); document.write("</tr>"); } for (var i=0; i < name.length; i++) { document.write("<tr>"); document.write("<td>" name[i] + "(" + party[i] + ")</td>"); document.write("td class='num'>" + votes[i] + "</td>"); var percent=calcPercent(votes[i], totalV) document.write("<td class='num'>(" + percent +"%)</td>"); createBar(party[i],percent) document.write("</tr>"); } document.write("</table>"); } </script> Just wondering if i misplaced any ; or { or } anywhere suggestions? Here is my call function Code: <script type="text/javascript"> showResults(race[0],name1,party1,votes1); showResults(race[1],name2,party2,votes2); showResults(race[2],name3,party3,votes3); showResults(race[3],name4,party4,votes4); showResults(race[4],name5,party5,votes5); </script> I been going over this, I can not seem to figure out what { i might be missing? Thanks 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 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.. 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 got javascripts button : Code: <input type="button" value="select" onClick="document.getElementById('input').select()" /> how can i transform "button" to image button (gif) Code: <html> <head> <script> //declare variable //var temp = 0; var Num = parseInt(prompt('Enter an Intger')); // starts the function factorial factorial(Num); //The function is declared function factorial(currentNumber) { if(currentNumber > 1) { //temp = temp + (currentNumber); factorial(currentNumber - 1); alert(currentNumber); } else { alert("here"); } } </script> </head> <body> </body> </html> This code is suppose to take the prompt number and keep subtracting one if > 1 but it seems to be not doing that at all and doing the else statement first then + till it gets to the prompt number. I have been staring at it for a while now and cant work it out. Thanks I need to input the functions for the buttons ( Push, Pop,Peek, Enqueue, and Dequeue) nothing I try works. Can anyone possible help me with one of the push, pop or peek, and then one of the Enqueue or Dequeue (any information I see online always has to do with wordpress which im not using) . Im really not asking for someone to do all the work for me, I just need a start. ok here is my code with the buttons just no functions <html> <head> <title>COP2500 - Lab 9</title> </style></head> <body> <center> <h3><b>COP2500 Assignment 9</b></h3> <b>Queue:</b> <form name="queue"> <input type=text size=60 name="display"><br> <input type=text size=5 name="entry"> <input type=button value="Enqueue" onClick="enqueue()"> <input type=button value="Dequeue" onClick="dequeue()"> </form> <hr> <b>Stack:</b> <form name="stack"> <table> <tr> <td>Entry: <input type=text size=5 name="entry"><br> <input type=button value="Push" onClick="push()"><br> <input type=button value="Pop" onClick="pop()"> <br> <input type=button value="Peek" onClick="peek()"><br> </td> <td><textarea name=display rows=20></textarea></td> </tr> </table> </form> </center> <script language="JavaScript"> var myqueue = new Array(); var front; var back; front = 0; back = -1; var mystack = new Array(); var top; top = -1; function enqueue() { // This function should take the value from the 'entry' text box and // add it to the back of the queue. The 'back' queue variable must be // incremented. // Since the queue changed, call the display function. Done. display_queue(); } function dequeue() { // This function should display the value of the 'front' element // in the queue using the 'alert' function and then increment the value // of the front variable. // if the queue is empty, i need to say so. // Since the queue changed, call the display function. Done. display_queue(); } function push() { // This function should add the value in the 'entry' text box to the stack, // and then increment the value of the 'top' variable. // Since the stack changed, call the display function. . display_stack(); } function pop() { // This function should use the alert function to display the top // of the stack and then remove the top item from the stack. // You can 'remove' the item simply by decrementing the value of 'top'. // If the stack is empty, it needs to say so. // Since the stack changed, call the display function. . display_stack(); } function peek() { // This function should use the 'alert' function to display the top // of the stack but not change the stack. If stack is empty,it needs to say so. } // ***************************************************************** // Do not edit anything below this line. Use the functions as given. // ***************************************************************** function display_queue() { var output; var i; output = " "; for (i = back; i >= front; i--) output = output + myqueue[i] + " "; document.queue.display.value = output; } function display_stack() { var output; var i; output=""; for (i = top; i > -1; i--) output = output + mystack[i] + "\n"; document.stack.display.value = output; } </script> </body> </html> I'm a newbie student coder for now, hoping to enter the wonderful world of software engineering in another year. I put together a very simple site for a class and all is well, but my "Contact SRS" form doesn't seem to want to run my JavaScript code even though I've used a JS debugger which returned no errors. When I click the Submit button it's supposed to validate the form. But I keep getting "Error on page" in the bottom IE 7 message bar (where it usually says "Done" when you load a page). There is another function that also does not work - it's in the Telephone number fields - it' supposed to check that the values entered are numbers. Would anyone be kind enough to try to run this page in your browser and see if the validation functions runs for you? If they don't, could you offer any suggestions as to code errors or possible browser settings that might be causing the problem? Thanks in advance to anyone offering their time!!! Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="description" content="Page used to contact SRS" /> <meta name="keywords" content="resume, resumes, job, jobs, job market, job info, interview tips, job interview, salary, salaries, cover letter, cover letters, SRS, Superior Resume Source, business cards, help with resume, help with job search" /> <title>Contact SRS</title> <link rel="stylesheet" href="style.css" type="text/css" media="screen" /> <script type="text/javascript">/* <![CDATA[ *//* ]]> */ function checkForNumber() { if (isNan(document.forms[0].area.value)){alert("You must enter a numerical value");return false;} else if (isNan(document.forms[0].exchange.value)){alert("You must enter a numerical value");return false;} else if (isNan(document.forms[0].phone.value)){alert("You must enter a numerical value");return false;} } // function validateForm () // { // if(document.forms[0].firstname.value==""){alert("You must enter your first name.");return false;}} // } // else if(document.forms[0].lastname.value== ""){alert("You must enter your last name.");return false;} // else if(document.forms[0].address1.value== ""){alert("You must enter your address.");return false;} // else if(document.forms[0].city.value== ""){alert("You must enter a city.");return false;} // else if(document.forms[0].state.value== ""){alert("You must enter a state.");return false;} // else if(document.forms[0].zip.value== ""){alert("You must enter your zip code.");return false;} // else if(document.forms[0].area.value== ""||document.forms[0].exchange.value== ""||document.forms[0].phone.value== "") // {alert("You must enter a complete phone number.");return false;}} // else {alert('Thank you! SRS will contact you within one business day.');}} function isEmpty(strfirst, strlast, straddress, strcity, strstate, varzip) { strfirst = document.forms[0].firstname.value strlast = document.forms[0].lastname.value straddress = document.forms[0].address1.value strcity = document.forms[0].city.value strstate = document.forms[0].state.value varzip = document.forms[0].zip.value //name field if (strfirst == "" || strlast == null || strfirst.charAt(0) == ' ') { alert("\"First Name\" is a mandatory field.\nPlease amend and retry.") return false; } //last name field if (strlast == "" || strlast == null || strlast.charAt(0) == ' ') { alert("\"Last Name\" is a mandatory field.\nPlease amend and retry.") return false; } //address field if (straddress == "" || straddress == null || straddress.charAt(0) == ' ') { alert("\"Address\" is a mandatory field.\nPlease amend and retry.") return false; } return true; } //city field if (strcity == "" || strcity == null || strcity.charAt(0) == ' ') { alert("\"City\" is a mandatory field.\nPlease amend and retry.") return false; } //state field if (strstate == "" || strstate == null || strstate.charAt(0) == ' ') { alert("\"State\" is a mandatory field.\nPlease amend and retry.") return false; } } function check(form)){ if (isEmpty(form.firstname)){ if (isEmpty(form.lastname)){ if (isEmpty(form.address1)){ if (isEmpty(form.city)){ if (isEmpty(form.state)){ } } } } } return false; } </script> </style> </head> <body> <a name="top"></a> <div id="container"> <div id="header"> <h1></h1> </div> <div id="content"> <h2>Contact SRS</h2> <p>Use this page to contact SRS and/or order products and services. Refer to our <a href="services.htm">Services</a> page for pricing.</p> <p><strong>Remember, our work is guaranteed or your money back!</strong></p> </div> <div id="sidebar"> <ul> <li><a href="index.htm">Home</a></li> <li><a href="about.htm">About SRS</a></li> <li><a href="services.htm">Services</a></li> <li><a href="contact.htm">Contact SRS</a></li> </ul> <div class="widget"> Did you know that employers prefer CV's that are limited to three pages or less? </div> <div class="widget"> First impressions last a lifetime... write a Thank You letter EVERY time! </div> <div class="widget"> Want to know your personality type? Take this FREE <a href="http://www.careerfulfillment.com/?hop=daviduk"> personality test.</a> </div> </div> </div> <form method="get" enctype="application/x-www-form-urlencoded"> <table border="0"> <tr> <td id="contact table" valign="top"> <h3><strong>Contact SRS</strong></h3> <p><strong>* Required</strong><p> <p>First Name*<br /> <input type="text" name="firstname" size="50" /> </p> <p>Last Name*<br /> <input type="text" name="laststname" size="50" /> </p> <p>Address*<br /> <input type="text" name="address1" size="50" /><br /> <input type="text" name="address2" size="50" /> </p> <p>City, State, Zip*<br /> <input type="text" name="city" size="34" /> <input type="text" name="state" size="2" maxlength="2" /> <input type="text" name="zip" size="10" maxlength="10" onchange="return checkForNumber;" /> </p> <p>Telephone*</p> <p>(<input type="text" name="area" size="3" maxlength="3" onchange="return checkForNumber;" />) <input type="text" name="exchange" size="3" maxlength="3" onchange="return checkForNumber;" /> <input type="text" name="phone" size="4" maxlength="4" onchange="return checkForNumber;" /></p> <strong>Check the reason(s) for your inquiry?*</strong> <p><input type="checkbox" name="geninquiry" value="General_Inquiry" />General Inquiry <br/> <input type="checkbox" name="help" value="Help" />Help<br/> <input type="checkbox" name="new_resume" value="Order New Resume" />Order a New Resume <br /> <input type="checkbox" name="Update_resume" value="Update My Resume" />Update My Resume <br/> <input type="checkbox" name="cover_letter" value="Order Cover Letter" />Order a Cover Letter <br /></p> <textarea rows="10" cols="50">Type your comments here</textarea> <p><input type="button" name="Submit" value="Submit" onsubmit="return check(this);" /> <input type="reset" /></p> </td> </tr> </table> </form> <a href="#top">Back to Top</a><br /> </body> </html> . Why do we have functions without parentheses at times? Ex 1) http://www.youtube.com/watch?v=OHYFNDzlDTE (On 2:18) Ex 2) At the bottom: Code: var panel, flag; function mousemoveResponse(e) { var x, y; if( window.event ) { x= event.x; y=event.y; } else if(e) { x=e.pageX; y=e.pageY; } if(flag) { panel.innerHTML = "Mouse is at X: " + x + ", Y: " + y ; } } function mouseoverResponse() { flag = false; panel.innerHTML = "Mouse is Over"; } function mouseoutResponse() { flag = true ; } function init() { panel=document.getElementById("panel"); flag = true; panel.innerHTML="Move the mouse..." ; document.onmousemove=mousemoveResponse; panel.onmouseover=mouseoverResponse; panel.onmouseout=mouseoutResponse; } onload=init; Hi, I am creating a mashUp with google maps and have a function that creates the map, marker, infowindow and all works great. I want to add more functions to that functions file. Do I start with another function Name() put my function in the {} and then I am going to use the onclick event when I want the function to run. I also am going to add more functions to this file Is that the correct way to keep adding functions? And what is the best way of calling them in my html file? Answers and examples would be great thank you im no jQuery rookie but for the first time ...instead of simply writing out the animation jQuery('element').hide() in that way.... i instead needed to keep track of the functions so i wrote it like function hidetheElement() { jQuery('element').hide() } but now i need to run 2 of those functions together after a click ...for example jQuery('ClickedElement').click( movethelement,hidethelement ) see what i mean?....i dont know how to properly run two defined functions whats the proper syntax.... and here is my actual code for reference (its basically a menu link being clicked...hiding one page...and showing another....i needed to define the functions so if a menu link is clicked it could hide every other page first...by function....and then call a function to show the page Code: jQuery(document).ready( function() { jQuery('#ladiesmenu').click( previewoff,ladieson ); function previewoff() { jQuery('#preview').fadeOut(500); } function ladieson() { jQuery('#ladies').fadeIn(500); } I would really like to thank the guys that have been helping me. I think my brain would have exploded otherwize. Some of the problems have been simple misspellings, but when you have been staring at the same thing for hours it can sorta slip by. HOPEFULLY this will be the last thing that I need some help with. Bascially Im not sure if Im using the function command properly. When Submit Details is click it should validate the form and then when Calculate is pressed calculate the form (obviously). I think maybe my var Array table is wrong? And the way the functions are set out doesnt seem it sit right. Code: <script type="text/javascript"> var element; var itemArray = new Array(); itemArray [0] = "Bike" //not sure if these are properly writen?// itemArray [1] = "TV" itemArray [2] = "iPod" itemArray [3] = "Car" var flag="OK"; var count = 0 document.write ("<form name='myform'><br><table>"); while (count <= 3) { if (count < 3) { document.write ("<tr><td><value>Enter money from " + itemArray [count] + " sale.</td><td><input type='text' name=" + itemArray [count] + "></td></tr>"); count++ } else { document.write ("<tr><td><value>Enter the price of " + itemArray [count] + ".</td><td><input type='text' name=" + itemArray [count] + "></td></tr>"); document.write ("<tr><td><input type='submit' value='Submit Details' onClick='validateform'</td></tr>"); document.write ("<tr><td><input type='submit' value='Calculate Details' onClick='calculateform'</td></tr></table></form>"); count++ } } function validateform() //<=== doesnt run { element=document.getElementsByTagName ('input'); for (counter=0; counter<element.length; counter++) { switch (element[counter].type) { case "submit": break; default: if (isNaN(element[counter].value) || (element[counter].value == "") ) { alert("You need to enter a number into " + element[counter].name); flag="NotOK" } else { Bike=element[0].value; TV=element[1].value; iPod=element[2].value; Car=element[3].value; } break; } } } function calculateform() //<=== Doesnt run either { if (flag=="OK") { if ( (Number(element[Bike])) && (Number(element[TV])) && (Number(element[iPod])) && (Number(element[Car])) ) //<========= Gets Bike is not defined error easy// { TotalMoney= parseFloat (Bike) + parseFloat (TV) + parseFloat (iPod) if (TotalMoney >= Car) { alert ("The total money is " + TotalMoney + " and the car price is " + Car + " and you can afford the car") } else { alert ("The total money is " + TotalMoney + " and the car price is " + Car + " and you cannot afford the car") } } } } </script> |