JavaScript - Simple Code Is Not Working For Ff
Simple random pic script that I found on the some other forum (I forget what it was)
[CODE]var aryimages = new Array('images/pic/01.jpg', 'images/pic/37.jpg', 'images/pic/02.jpg', 'images/pic/family/08.jpg','images/pic/08.jpg', 'images/pic/food/03.jpg'); randompic.src = aryimages[Math.floor(Math.random() * aryimages.length)]; [CODE] code anchors to HTML markup [CODE]<img name="randompic" id="bg" />[CODE] it is working perfectly for Safari and Chrome. Nothing is showing for FF. Any suggestions appreciated. Similar Tutorialsindex.html Code: <html> <head> <title>:: wtmp</title> </head> <body> <p>Welcome to my page</p> <script type="text/javascript" src="file.js"></script> </body> </html> file.js Code: function one(p1, p2) { var j_text=p1+" "+p2; return j_text; } function two() { var rslt=one("Hi", "there!"); } document.write(rslt); var mainscrpt=one("Hello", "world!"); window.alert(mainscrpt); Can someone please help with this code. The window is supposed to automatically scroll and move but it isn't working. (It was taken from a discontinued book called javascript in 24hrs) The javascript: Quote: var pos=100; function Scroll(){ if (!document.getElementById ) return; obj=document.getElementById("thetext"); pos -=1; if(pos < 0-obj.offsetHeight + 130) return; obj.style.top=pos; window.setTimeout("Scroll();", 30); } //start scrolling when the page loads window.onload=Scroll; the css: Quote: #thewindow{ position:relative; width:180px; height:150px; overflow:hidden; border:2px solid red; } #thetext{ position:absolute; width:170px; left:5px; top:100px; } the html: 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-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link rel="stylesheet" type="text/css" href="scroll.css" /> </head> <body> <h1> scrolling window example</h1> <p>This example shows a scrolling window created using javascript and the w3cdom.The red border window is actually a layer that shows a cliped portion of a larger layer"</p> <div id="thewindow"> <div id="thetext"> <p>This is the first paragraph of the scrolling message.The message is created with regular html</p> <p>Entries within the scrolling area can use any html tags.They can contain <a href="#">links</a></p> <p> No limit to the number of paragraphs that you can include here...</p> <ul> <li>For example you could format items using a bulleted list.</li> </ul> <p>The scrolling ends when the last part of tht scrolling text ids on the screen.You've reached the end.</p> </div> </div> </body> </html> Hey everyone here is my code for looking up a city, and state by zip code. I am getting no errors and i believe it should work, but the code does not seem to want to function. Any ideas? Here is my 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=utf-8" /> <title>City and State Lookup</title> <style type="text/css"> h1 { font-family:Arial; color:navy; } p, td { font-family:arial; font-size:11px; } </style> <script type="text/javascript"> /* <![CDATA[ */ var httpRequest = false; function getRequestObject() { try { httpRequest = new XMLHttpRequest(); } catch (requestError) { try { httpRequest = new ActiveXObject ("Msxm12.XMLHTTP"); } catch (requestError) { try { httpRequest = new ActiveXObject ("Microsoft.XMLHTTP"); } catch (requestError) { window.alert("Your browser does not support AJAX!"); return false; } } } return httpRequest; } function updateCityState() { if (!httpRequest) httpRequest = getRequestObject(); httpRequest.abort(); httpRequest.open("get","zip.xml"); httpRequest.send(null); httpRequest.onreadystatechange=getZipInfo; } function getZipInfo() { if (httpRequest.readyState==4 && httpRequest.status == 200) { var zips = httpRequest.responseXML; var locations = zips.getElementsByTagName("Row"); var notFound = true; for (var i=0; i<locations.length; ++i) { if (document.forms[0].zip.value == zips.getElementsByTagName( "ZIP_Code")[i].childNodes[o].nodeValue) { document.forms[0].city.value = zips.getElementsByTagname( "City") [i].childNodes[0].nodeValue; document.forms[0].state.value = zips.getElementByTagName( "State_Abbreviation")[i].childNodes[0].nodeValue; notFound = flase; break; } } if (notFound) { window.alert("Invalid ZIP code!"); document.forms[0].city.value = ""; document.forms[0].state.value = ""; } } } /* ]]> */ </script> </head> <body> <h1>City and State Lookup </h1> <form action=""> <p>Zip code <input type="text" size="5" name="zip" id="zip" onblur="updateCityState()" /></p> <p>City <input type="text" name="city" /> State <input type="text" size="2" name="state" /></p> </form> </body> </html> I have entered the following in a file named welcome.htm when the form is submitted the Test! Alert comes up but the alert fields indicating the fields are empty do not appear. Please let me know if you can see why. Thanks Code: <html> <head> <script type="text/javascript"> alert('Test!'); function submitform() { alert('Test!'); alert('In fname is '+document.form.fname.value); if (document.form.fname.value == ""){ alert('The fnamefield is empty!'); return false; } if (document.form.age.value == ""){ alert('The fnamefield is empty!'); return false; } return true; } </script> </head> <body> <form id="myform" action="welcome.php" method="post" onSubmit="return submitform()" > Name: <input type="text" name="fname" /> Age: <input type="text" name="age" /> <input type="submit" /> </form> </body> </html> Hi I am new to teaching JavaScript I need to show how to create a form with validation and feedback. I can get it to validate a text with a message, but I cannot get it to validate a set of radio buttons and conform the radio selected. Code below- <html> <head> <title>Exam entry</title> <script language="javascript" type="text/javascript"> function validateForm() { var result = true; var msg=""; if (document.ExamEntry.name.value=="") { msg+="You must enter your name \n"; document.ExamEntry.name.focus(); document.getElementById('name').style.color="red"; result = false; if (document.ExamEntry.subject.value=="") { msg+="You must enter the subject \n"; document.ExamEntry.subject.focus(); document.getElementById('subject').style.color="red"; result = false; } } if(msg==""){ return result; } { alert(msg) return result; } } </script> </head> <body> <h1>Exam Entry Form</h1> <form name="ExamEntry" method="post" action="success.html"> <table width="50%" border="0"> <tr> <td id="name">Name</td> <td><input type="text" name="name" /></td> </tr> <tr> <td id="subject">Subject</td> <td><input type="text" name="subject" /></td> </tr> <tr> <td><input type="reset" name="Reset" value="Reset" /></td> </tr> </table> </form> <script type="text/javascript"> function lengthpass() { var s1=document.getElementById("password"); if(s1.value.length != 4) { alert("Please enter an exam number which is 4 characters long"); return false; } return true; } </script> </head> <body> <form onsubmit="return lengthpass();"> Exam Code <input type="text" id="password" name="password"> (Four Numbers) <br> <br> <h1>option button form validation</h1> <script type="text/javascript"> function option1() { var checkedop=null; var examop=document.getElementsByName("exam"); for (var i = 0;i<examop.length;i++) { if(examop[i].checked) { checkedop=examop[i]; } } if(checkedop==null) { alert("please select an exam"); return false; } { confirm("you have chosen"+checkedop.value+ "is this correct?"); } } </script> </head> <body> <form name="examtype" onsubmit="return option1();"> Select an exam type<br> <input type="radio" name = "exam"value= "GCSE"> GCSE<br> <input type="radio" name = "exam"value= "AS"> AS<br> <input type="radio" name = "exam"value= "A2"> A2<br> <input type="submit"name="submit"value="Submit Form"/> </form> </body> </html> Do you see anything wrong with this code... Code: <SCRIPT LANGUAGE="JavaScript"> if(GetCookie('upgrade8') != null) { location.href="cookie-in.html" } </SCRIPT> Also tried this (didn't work either)... Code: <SCRIPT LANGUAGE="JavaScript"> var readCookie = getCookie("upgrade"); if (readCookie("upgrade") != null){ // if cookie already exists, go to url document.location = "lesson1"; } else { // else go someplace else document.location = "lesson2"; }; </script> I've tried posting in both the head and body. Still can't get it to redirect. I'm a little new to this. Your help would be appreciated. thanks I have used this formula before, for some reason it isnt working properly. If the value is equal to 0 it will give an alert and return false. Then if you change the value of the drop down it won't let you submit. Does anyone see anything wrong? Code: <script type="text/javascript"> <!-- function validate_form ( ) { valid = true; if ( document.week_picks.blowout.value == "0" ) { alert ( "Please Select a Blowout" ); } return false; } //--> </script> Code: <form name="week_picks" method="post" action="confirm.php" onsubmit="return validate_form()"> <select id="blowout" name="blowout"> <option value="0">..</option> .... </select> Thanks for any help. Hi. Just started fooling around with Ajax a bit back. So far, it's been fine. Today, though, I'm hitting some error I can't figure out. It *should* work, but it doesn't, and I have no idea why. Simple HTML form page with a bit of css. No big deal. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <script type="text/javascript" src="livesearch.js"></script> <style type="text/css"> #livesearch { margin:0px; width:194px; } #txt1 { margin:0px; } </style> </head> <body> <form> <input type="text" id="txt1" size="30" onkeyup="showResult(this.value)" /> <div id="livesearch"></div> </form>type </body> </html> Problem area below in bold. Code: function showResult(str){ if (str.length == 0) { document.getElementById("livesearch").innerHTML = ""; document.getElementById("livesearch").style.border = "0px"; } var xmlhttp = getXMLHttpObject(); if (xmlhttp == null){ alert("Your browser does not support XML HTTP requests!"); return; } var url = "livesearch.php"; url = url + "?q=" + str; url = url + "&sid="+Math.random(); xmlhttp.onreadystatechange=stateChanged ; xmlhttp.open("GET", url, true); xmlhttp.send(null); } function stateChanged(){ if (xmlhttp.readyState == 4){ alert("Never seems to hit a readystate==4"); document.getElementById("livesearch").innerhtml = xmlhttp.responseText; document.getElementById("livesearch").style.border="1px solid #A5ACB2"; } } function getXMLHttpObject(){ //Current browsers if (window.XMLHttpRequest){ return new XMLHttpRequest(); } //For IE 5/6 if(window.ActiveXObject){ return new ActiveXObject("Microsoft.XMLHTTP"); } else { return null; } } My PHP file is just a simple echo statement to see that it works to that point. It doesn't. For whatever reason, it never seems to hit readyState ==4. It enters the function (I've checked with alerts), but the if statement never comes out to be true. I have no idea why. I've combed over the code for errors for a while now and I can't find anything. Any ideas? Would be much obliged. I have a simple javascript for validating the radio buttons. But for what ever reason window.location does not redirect. this is my code: <SCRIPT LANGUAGE="JavaScript"> function checkRadio (frmName, rbGroupName) { var radios = document[frmName].elements[rbGroupName]; for (var i=0; i <radios.length; i++) { if (radios[i].checked) { return true; } } return false; } function valFrm() { if ( checkRadio("frm1","radio1")==true && checkRadio("frm1","radio2")==true) window.location="price.jsp"; else alert("You didnt select any price"); } </script> when i replace an alert with the redirect line it works fine. any help would be appreciated. i am new in programming and learning it from lynda but i am trying to make a program which according to me is good enough but its not working and i am using free javascript editor for compiling and coding <!DOCTYPE html> <html> <body> <script> var a = 5; var b = 10; var c = 30; var d = a + b + c; alert("the value of d is" + d); </body> </html> Please tell me where is it i am making mistake Reply With Quote 01-08-2015, 11:56 PM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts You forgot the </script> ending tag. I'm new to JavaScript, I just finished some basic things, like getAttribute, setAttribute, getElementByID etc. I understand that inline javascript isn't the best way to go, and all the JavaScript should go on an external JS file. I also know that you should be able to downgrade gracefully, allowing people whose browser do not/blocked javascript to still use the site. So I just want to do a simple go back function in an external javascript, however it's not exactly working. This is my JS code: Code: window.load = preparePage(); function preparePage(){ if (!document.getElementById()) return false; if (!document.getElementByTagName()) return false; var backDiv = document.getElementByID("back"); links.onclick = function(){ history.go(-1); return false; } } Here is my HTML code Code: <div class="back"> <a href="http://forum.thekks.net">Back</a> </div> Hi, I'm new to Javascript, so bear with me. I'm trying to use a script that replaces the contents of a div, based on div id's. I've gotten it to work how I want he http://www.sixnations.be/home1.html But can't get it to work here, and I'm not sure why: http://www.sixnations.be/menu.html Relevent code, Javascript: Code: function changeMenu(obj) { if (obj == 'food') { //alert('food'); var fd = document.getElementById('food'); fd.style.display = 'inline'; var fdi = document.getElementById('foodImages'); fdi.style.display = 'inline'; var dr = document.getElementById('drink'); dr.style.display = 'none'; var dri = document.getElementById('drinkImages'); dri.style.display = 'none'; } else if (obj == 'drink') { //alert('drink'); var fd = document.getElementById('food'); fd.style.display = 'none'; var fdi = document.getElementById('foodImages'); fdi.style.display = 'none'; var dr = document.getElementById('drink'); dr.style.display = 'inline'; var dri = document.getElementById('drinkImages'); dri.style.display = 'inline'; } } HTML (the data's tabular, hence the tables): CSS: Code: /*-- MAIN CONTENT --*/ .maincont { width: 930px; margin: auto; margin-top: 10px; overflow: auto; } .backcont { position: relative; width: 620px; margin-right: 296px; } .backrightcont { float: right; width: 296px; } .backtop, #info_En, #info_Fr, #info_It, #drink, #food, .backrighttop { background-image: url(../sixnations_images/backtop.png); background-repeat: repeat-x; background-position: bottom; border-right: 1px solid #21201C; border-left: 1px solid #21201C; width: 100%; height: 57px; text-align: center; } .backbottom { background-image: url(../sixnations_images/backbottom.png); } #info_En, #info_Fr, #info_It, #food, #drink { background-image: url(../sixnations_images/contentback4.png); background-repeat: repeat; padding-bottom: 30px; text-align: left; height: auto; } .backright, .backrighttop, .backrightbottom { width: 100%; } .backright { background-image: url(../sixnations_images/backright.png); } .backrighttop { background-image: url(../sixnations_images/backtop2.png); background-position: top; border: 0; } .backrightbottom { height: 50px; background-image: url(../sixnations_images/backrightbottom.png); border: 0; } .backrighttop h1, .backright h1 { font-family: 'Cambria', Palatino, Georgia, serif; font-size: 1.6em; color: #eee; line-height: 70px; text-align: center; } .backright h1 { width: 95%; line-height: normal; border-top:1px dashed #333; padding-top: 15px; } #noborder { border:0; } .twitter { margin-left: 15px; } #info_Fr, #info_It, #drink { display: none; } .lang, #info_En p, #info_En h1, #info_Fr p, #info_Fr h1, #info_It p, #info_It h1, #food h1, #food p, #drink h1, #drink p { width: 71%; margin: auto; } #info_En h1, #info_Fr h1, #info_It h1, #food h1, #drink h1 { font-family: 'GothamBook','Cambria', Georgia, serif; font-size: 2.5em; color: #000; padding-bottom: 10px; padding-top: 20px; margin-bottom: 15px; font-variant: small-caps; letter-spacing:.1em; text-align: center; border-bottom: 1px dashed #777; } .lang { margin-top: 35px; padding-top: 5px; border-top: 1px dashed #777; font-size: 1em; font-variant: small-caps; text-align: right; color: #777; } .lang a:hover { background-color: #777; color: #eee; } /*-- MAIN CONTENT -- SPORTS ON TV / FOOD & DRINK --*/ table.sports, table.menu1 { width: 90%; margin: auto; } table.sports thead td, table.menu1 thead td { font-size: 1.3em; font-variant: small-caps; color: #777; border-bottom: 1px dotted #999; width: 100%; padding-top: 20px; } table.sports tr, table.menu1 tr { border-bottom: 1px dotted #999; } table.menu1 tr { border: 0; } table.sports td { padding: 7px; } table.menu1 td { border:0; padding: 8px; } table.sports td.foot, table.sports td.rugby { background-image: url(../sixnations_images/ball1.png); background-repeat: no-repeat; background-position: bottom left; padding-left: 35px; } table.sports td.foot { background-image: url(../sixnations_images/ball2.png); } table.menu1 td.desc { color: #888; font-style: italic; padding-top: 0px; font-size: .9em; } Any ideas? Hi, I have a small script that tries to open a child window. if successful, it then closes the child window and redirects the parent window. If this process fails, there is no child window, no redirection. the script below works fine in FireFox but in Chrome, if the process fails, the redirection still happens. I'm new to JS would appreciate your help many thanks Code: <script type="text/javascript"> function openwindow(){ testWindow = window.open("popup.php","interaction"); setTimeout(function() { testWindow.close(); },1000); setTimeout(function() { window.location = "http://www.google.com"; },1000); } </script> The code I commeted out dosen't work I want to check if its null and if so alert them. { // PART 2: YOUR CODE STARTS AFTER THIS LINE correctAnswer = Math.floor((Math.random() * 100) + 1); // For testing purposes. alert("Testing purposes, correct answer is: " + correctAnswer); var number = 0; //// Calculations //if (isNaN(number) = true) { // alert("Thats not a number"); //} //document.write(number); while (number != correctAnswer) { number = prompt("Wrong Number, guess again."); number = Number(number); if (number < correctAnswer) { document.writeln("Small guess: " + number); } if (number > correctAnswer) { document.writeln("Large guess: " + number); } if (number == correctAnswer) { document.writeln("Correct guess: " + number); } } } I would like to compare my work to the work of others, can you please solve this and post your result? Declare an 8 x 8 matrix and an array of length 22. 1.- Populate the matrix. 2.- Copy the elements of the first row of the matrix, the anti-diagonal, and the last row of the matrix into the array, to form a Z shape. 3.- Sort the array. 4.- Assuming that the data in the arrays are grades, compute the average of the grades stored in the even locations of the array. 5.- Copy the array back into the matrix.(back into the Z) 6.- Print out the matrix values. Hi... i have this code: <script type='text/javascript'> cookie_name = GetCookie("href_location"); if(cookie_name){ alert("Cookie found, redirecting to stored cookie."); document.location.href=cookie_name; } </script> I will like to create a iframe using the info from the "cookie_name" value <iframe name="FRAME1" src="cookie_name" width="350" height="320" frameborder="0" scrolling="auto"></iframe> I have a script that set a cookie with the value of a chosed website, what i need now is to create an iframe with that value. Any help will be apriciated. Sorry for my poor enlish Here's the basic concept, its somewhat of a counter, and I think javascripts the way to go... Basically I'm looking to generate a running number... x + 11 = print the number The tricky part is, I need it to never stop, somewhat like a timer (example http://www.hashemian.com/tools/javascript-countdown.htm) but not a timer... Think the tally mark on McDonald's 99 billion served.. Any suggestions or ideas? I just started learning JavaScript. I'm sure it's something really simple but I cannot figure out what is missing from my code. No matter what year I enter into the text box, I keep getting "The year you entered, 2080393, is a leap year." It's not returning false...ever. Can someone please tell me what I'm doing wrong so I can stop pulling my hair out? Thanks! <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>Is It A Leap Year?</title> <script type="text/javascript"> /* <![CDATA[ */ function isLeapYear(year) { year = parseInt(year); var leapYear = true; var remainder = 0; if(isDivisibleBy(year, 4)) { leapYear = true; } if(isDivisibleBy(year, 100)) { leapYear = false; } if(isDivisibleBy(year, 400)) { leapYear = true; } if(leapYear) { window.alert("The year you entered, " + year + ", is a leap year."); } else { window.alert("The year you entered, " + year + ", is not a leap year."); } } function isDivisibleBy(year, divisor) { var remainder = 0; remainder = year%divisor; if(remainder == 0) { return true; } else { return false; } } /* ]]> */ </script> </head> <body> <form action="" id="GetLeapYear"> <p><strong>Is It a Leap Year?</strong></p> <p><strong>Enter a valid 4-digit year below to find out!</strong><br /></p> <p> <input type="text" name="year" size="20" style="color: black; border-style: solid; border-color: inherit; border-width: medium; background-color: Transparent" value="" /> <input type="button" value="Leap Year?" onclick="isLeapYear(document.getElementById('GetLeapYear').year.value);" /> </p> </form> </body> I have a simple function to display an image when called, but if I try to rewrite the function to take the image as an argument, it stops working. I've looked at other function examples on the web but can't figure out what I am missing. Can anyone help? works: Code: <html> <script language="JavaScript"> var ImagePlusSign = '<img src="plus.jpg" name="slide" width="65" height="50"/>'; function FlashImagesThenWait() { document.getElementById("first").innerHTML = ImagePlusSign } setTimeout(FlashImagesThenWait, 1500); </script> <body>Hello. <div id="first"> </div> </body> </html> does NOT work : Code: <html> <script language="JavaScript"> var ImagePlusSign = '<img src="plus.jpg" name="slide" width="65" height="50"/>'; function FlashImagesThenWait(z) { document.getElementById("first").innerHTML = z } setTimeout(FlashImagesThenWait(ImagePlusSign), 1500); </script> <body>Hello. <div id="first"> </div> </body> </html> So frustrating that lately I've been having trouble with the simplest of code, and this is about as simple as it gets. Matched it up with every similiar example I can find both in books and on the net, and it seems to be perfectly valid code, but when I run it, nothing. :S 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>Untitled Document</title> <script language="javascript" type="text/javascript"> function favouriteColour() { var index = document.getElementById("select1").options[document.getElementById("select1").selectedIndex].value; document.getElementById = "Your favourite colour is " + index; } </script> </head> <body> <select id="select1"> <option></option> <option id="black" onchange="favouriteColour()">Black</option> <option id="white" onchange="favouriteColour()">White</option> <div id="favcolour"></div> <option> </select> </body> </html> Thanks in advance. |