JavaScript - Few Javascript Noob Questions
I'm quite new to JavaScript, but I wanted to add a feature to a sample website that I need to have done by tomorrow night.
I have two HTML paragraphs which I will call "a" and "b". Below those paragraphs I have a text box and a submit button. This is how I declared them in the HTML doc: Code: <input type="text" name="message" value="Blank Message" id="newsmessage" /> Code: <input type="button" value="Post" id="submitbutton" onclick="updatepost()" /> Now when I click the submit button I want paragraph b to replace itself with paragraph a, and I want paragraph a to replace itself with the text in the text box. Here's the JavaScript that I have written. (I'm aware it's probably quite off.) Note: paragraph a is toppost, paragraph b is bottompost, the text box is named message, and I created p1 and p2 as temporary holders for the strings. Err... variables. Code: <script type="text/javascript"> function updatepost() { p2=document.getElementById("toppost"); document.getElementById("bottompost").innerHTML=p2; p1=document.message.elements[i]; document.getElementById("toppost").innerHTML=p1; } </script> As of right now the paragraph a holds the text "a" and paragraph b holds the text "b". When I click post paragraph a still reads "a" and paragraph b reads "[object HTMLParagraphElement]". Sorry for my minimal JavaScript knowledge; I have full intentions of fully learning the language quite soon. I just wanted to implement this feature in a site that I had to create and my deadline is tomorrow. Thanks guys! -Dave Similar TutorialsHey guys I'm new to Javascript and need some help with this code Code: <HTML> <HEAD> <TITLE>Swap Test</TITLE> </HEAD> <BODY> <script type="text/javascript"> var numberOne; var numberTwo; // Declaring the values of numberOne and numberTwo var numberOne = 9; var numberTwo = 1; // Variables are swapped numberOne = numberTwo; numberTwo = numberOne; // Output is displayed on-screen document.write (numberOne); document.write (numberTwo); </script> </BODY> </HTML> What I need to do is to declare the two variables, swap their values and then show the results on the screen. ...but it's not working, any ideas? Thanks! x hi all i'm kind of new to the JS world and need your help with some thing i hope it not that big to ask. if you go to linkedin website with your user (www.linkedin.com) you will see a bar called LinkedIn Today. what i need is this kind of bar but with messages changing all the time(moving) is this some thing i need to write from scratch or there some example that i can use? any help will be good for me now because i need to do it ASAP regards,shay I have a slideshow that goes through pictures once you click on the Play button and doesn't stop until you press on the Stop button. How can I make it so that it automatically plays once the website loads without having to click on the Play button? Heres the code: Code: <div class="tabs png"><span class="tabs-inner"><a href=""></a> <a href=""></a> <a href=""></a> <a href=""></a> <a href=""></a> <a href=""></a> <a href=""></a></span></div> <div class="slider-indent-button"> <a href="#" onClick='$("div.tabs").tabs().play();'>Play</a> <a href="#" onClick='$("div.tabs").tabs().stop();'>Stop</a> </div> All help is much appreciated!!! I am working on a site for an online radio station and I want an external player to launch on site visit and to continue playing as the visitors surf my site. I feel I am 95% there as I have the player spawning on launch and checking for popup blockers. If a popup blocker is found the user is prompted to add my domain to their allowed lists so that future visits will launch the player right out of the box. My problem is this. When someone navigates back to the "home" page (where the script is located the external player window reloads and I do not want it to. I have found a couple of sites that say do this and that but I am a 100% novice at javascript and can not figure it out. here is the url of the site I am building http://www.radiotrips.com/czmradio - If you have popup blocker on you should get an alert. If not a small player should launch here is the code that I am using to spawn the external player and check for popup blockers ************** <script language="javascript" type="text/javascript"> function detectPopupBlocker() { var czmTest = window.open("http://www.radiotrips.com/czmradio/player/mini/no_ads.html","Cozumel Radio","width=478,height=260"); if (!czmTest) { alert("We were unable to automatically open the Cozumel Radio Player due to your pop-up blocker... Please add CozumelRadio.net to your allowed sites for your best listening experience"); } else { window.open("http://www.radiotrips.com/czmradio/player/mini/no_ads.html","Cozumel Radio","width=478,height=260"); } } ************** if anyone could add the code that would make the browser check to see if this window is already open and if so not reload it I would GREATLY appreciate it. I feel like it is 1 to 2 lines of code max according to what I have seen elsewhere but just cant figure it out. Thanks a Million in advance Chris Hey, I've got to make the values of some textboxes change the co-ordinates of my sprite on a canvas and havent a clue on how to do it, Here is my form with the two textboxes and submit button: <form> x: <input type="text" name="x" /><br /> y: <input type="text" name:"y" /><br /> <input type="submit" value="Submit"/><br /> </form> And i need it so that they change the values of these: //this shows where my sprite will start on the canvas var block_x; var block_y; searched the internet for hours and cant really find anything i understand or works. any help is much appreciated Hi all, ok firstly i know all but nothing about javascript and you prob about to see the worst attempt eva at trying to understand it ok so here is my js code Code: <script language="javascript"> function selectElement(idElement) { var ratingval = ""; liElement = document.getElementById('sel'+idElement); lirating = document.ratingform.userrating.value; if(liElement == "sel1") { raingval = "1"; lirating = "1"; } if(liElement == "sel2") { raingval = "2"; lirating = "2"; } if(liElement == "sel3") { raingval = "3"; lirating = "3"; } if(liElement == "sel4") { raingval = "4"; lirating = "4"; } if(liElement == "sel5") { raingval = "5"; lirating = "5"; } } </script> and here is my html code Code: <form name="ratingform" action="" method="post"> <fieldset class="login"> <legend>Personal Details</legend> <div> <label for="fname">First Name</label> <input type="text" id="fname" name="fname" value="<?php if(isset($_POST['fname'])){ echo $_POST['fname'];}?>"> </div> <div> <label for="lname">Surname</label> <input type="text" id="lname" name="lname" value="<?php if(isset($_POST['fname'])){ echo $_POST['lname'];}?>"> </div> </fieldset> <fieldset class="contact"> <legend>Review</legend> <div> <label for="title">Review Title</label> <input type="text" id="title" name="title" value="<?php if(isset($_POST['title'])){ echo $_POST['title'];}?>"> </div> <div> <label for="review">Review</label> <textarea name="review" id="review" cols="33" rows="5"><?php if(isset($_POST['review'])){ echo $_POST['review'];}?></textarea> </div> </fieldset> <fieldset class="rating2"> <legend>Rating</legend> <div> <label for="rating">User Rating</label> <ul class="rating"> <li id="current" class="current" style="width: <?php echo $_GET['rating']?>em;"></li> <li id="sel1"><a onclick='onClick="javascript:selectElement(1)' class="rate1" title="I hated it">*</a></li> <li id="sel2"><a href="?rating=2" class="rate2" title="I disliked it">*</a></li> <li id="sel3"><a href="?rating=3" class="rate3" title="It was OK">*</a></li> <li id="sel4"><a href="?rating=4" class="rate4" title="I liked it">*</a></li> <li id="sel5"><a href="?rating=5" class="rate5" title="I loved it">*</a></li> </ul> </div> </fieldset> <div> <input type="hidden" name="userrating" value="" /> <input type="submit" name="Submit" value="Submit"><?php if($error == TRUE){echo $message;}if($submit == TRUE && $error == FALSE){echo $message;}?></div> </form> ok so what im trying to acheive is that when a user clicks on either of the rating links, a js function is run which gets the li value and then sets a value of a varible to match the li value and then i want to add that value to the hidden userrating form input and set the value of <li id"current" width value to the same value but as im sure youve noticed from my code it isnt working. any help it greatly needed and appreciated, thanks Luke I am trying to dynamically add rows to a table when the user clicks a button. here my function Code: function addFocusArea() { if(addTlFocusAreaCount <= 5) { //Create new Title row var titleRow = document.createElement("tr"); var titleCol = document.createElement("th"); var titleText = document.createTextNode("Additional Focus Area " + addTlFocusAreaCount); titleCol.appendChild(titleText); titleRow.appendChild(titleCol); document.getElementById("focusTable").appendChild(titleRow); //Create new category row var categoryRow = document.createElement("tr"); var categoryCol = document.createElement("td"); var categorySelect = document.createElement("select"); var categories = document.getElementById("<%=DecisionToolKeys.PRIMARY_FOCUS%>"); //copy a dropdown menu that is already existing on the page for(var i=0; i<categories.length; i++) { var option = document.createElement("option"); option.value = categories[i].value; option.text = categories[i].text; categorySelect.options.add(option); } categoryCol.appendChild(categorySelect); categoryRow.appendChild(categoryCol); document.getElementById("focusTable").appendChild(categoryRow); addTlFocusAreaCount++; } else { alert("You cannot add more than five additional practice areas."); } } And here is my button Code: <input type="button" value="Add Focus Area" onclick="JavaScript:addFocusArea()"/> This is working in Firefox and Chrome, but not IE 8. Any clue as to why? Thanks, Nick I have a page that open two frames. Second frame, most of the page, is empty. First frame contains a form that retrieves user input, when you click the button, it send that input back to the original parent html, which detects the GET parameters, and builds a custom URL. I want to then load that custom URL in the 2nd empty frame. I figure I need to modify the src atttribute of the 2nd frame in the frameset, but I can't make it work. Code: <frameset id='parent' rows='10%,90%'> <frame id='frm1' src='./form.html' /> <frame id='frm2' src='' /> </frameset> <script>modFrmSrc();</script> where modFrmSrc() checks for the GET values, builds the URL, and then tries to load the URL in frm2. Is there a way to get this done? Hi all, I sincerely apologise for the noob question. I have search and searched for an answer but to no avail, so I hope someone on here can help. I'm trying to get a fisheye verticle menu working. I've found somethin which fits the requirement he http://zendold.lojcomm.com.br/ifisheye/ and tried to make it work. It just doesn't. I've tried different versions of mootools etc but I think I'm missing something really stupidky simple. I'd really appreciate it if someone could have a look at my temp page (http://www.parkerbs.com/home1.htm) and point me in the right direction. Many thanks in advance. Paul I am newbie in javascript. While being studying it I have not understood some concepts well. JS is prototype-based language, as in Java it has one main prototype Object, also there are some other widely used object, like Array, RegEx, String ...... . So I can access and inherit from this objects/prototypes. So the questions is where do this object (declarations) are stored ? They are also allocated in memory ? Or when JS sees that there is declaration of some object is present i script it reads from file or whatever ? When I am using Function with key word new, what happens. As far as function is also object, it has field prototype and when calling this function with new it returns object of prototype type ? Am I right ? So if I haven't specified prototype it will returns object of Object type ? How does javascript knows about real type of variable. For example when I use regexp, it has method exec. I can call it on every variable. But I guest if variable doesn't have this field it returns undefined ? So the question is how does JS determine what real type of variable is ? Where this information is stored ? Closure in JS. I don't understand this concept well. I think of it like reference count in Java (used or been used by Garbage Collector). If we have a least one reference to variable it will still exist and it doesn't matter where it was declared. So making getter method inside another func makes it exists in memory. If I am wrong please give good explanation of this. Does JS runs in its own virtual machine like Java ? Or browser plays this role. I guess if it has GC, since one process cannot access address space of another process it should be something like virtual machine which controls memory allocation. I would be very grateful for help. Thx in advance. Reply With Quote 01-21-2015, 10:44 AM #2 Dormilich View Profile View Forum Posts Senior Coder Join Date Jan 2010 Location Behind the Wall Posts 3,532 Thanks 13 Thanked 372 Times in 368 Posts Questions About Javascript - JavaScript | Dream.In.Code Hey everyone. I am very new at JavaScript and I need some help. I want to have a section on my home page where a person can choose a bike by clicking on a couple of arrows on the right and left ends of the bike. I want something similar to this type of program. http://qlpros.com/ I don't want a border around the bike. I have been looking for a couple hours now and I haven't found anything. Any help would be much appreciated!! My other question is how to transfer javascript to an external style sheet in dreamweaver. Thanks!! Ok, so I have a couple of questions about JavaScript that I would like answered by the programming gurus on this forum, please. Firstly, I have an idea for an online text-based role-playing game (games like GangsterParadise, etc.), and I am wondering, is it possible (or advisable?) to create the site using nothing but HTML, CSS and JavaScript? Can it be done, and if so, are there any downsides to doing this? I have heard using strictly JavaScript as a programming language on its own, on a site where members will have their own password-protected accounts, should not be done, as there are serious security flaws - is this true, and if so, why? Secondly, most JS programmers on the forum have probably digested and been through hundreds and hundreds of books on the subject since beginning to learn JavaScript - in your opinion, what are the best books to get hold of, for a relative beginner to JavaScript? What book makes the language easy to understand, and doesn't have you scratching your head to make sense of what it is saying? Thanks a lot in advance for the help, it's much appreciated. Hi all, I'm desperately trying to figure out how to "transform" Javascript commands into HTML code. Excuse my noobness but I really know nothing about Javascript. Basically, I have this Google API Search code: 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> <title>My Google AJAX Search API Application</title> <script src="http://www.google.com/jsapi?key=CUT"></script> <script language="Javascript" type="text/javascript"> //<![CDATA[ google.load("search", "1"); function OnLoad() { // Create a search control var searchControl = new google.search.SearchControl(); // Add in a full set of searchers var localSearch = new google.search.LocalSearch(); searchControl.addSearcher(localSearch); searchControl.addSearcher(new google.search.WebSearch()); searchControl.addSearcher(new google.search.VideoSearch()); searchControl.addSearcher(new google.search.BlogSearch()); // Set the Local Search center point localSearch.setCenterPoint("New York, NY"); // Tell the searcher to draw itself and tell it where to attach searchControl.draw(document.getElementById("searchcontrol")); // Execute an inital search searchControl.execute("Google"); } google.setOnLoadCallback(OnLoad); //]]> </script> </head> <body> <div id="searchcontrol">Loading...</div> </body> </html> Now, what I'm desperately trying to do since 4-5 hours is to have the search results between the <div id="searchcontrol"></div> encoded as HTML in the loaded page. Currently, when the page is loaded and I look at the source code, I have the word 'Loading...' in the <div> tags, despite in the normal view there are G results listed. I need those results encoded as HTML for SEO reasons. Researching on this matter I thought the problem could be the OnLoad command, that makes the script load after all the other HTML elements are loaded. But I tried to make it load before all the elements in the page, and the problem persists. How can I solve this? Thanks in advance for any help! I recently read a couple blogs that listed some points for writing better Javascript code. Several points applied to the code I write, so they caught my eye. For example, Quote: Use === instead of == and Quote: Use [] Instead of New Array() All of my programs are for numerical computations. Input comes from a textarea box, it is converted to floats, then it is put in arrays, compared, manipulated, etc. For example, Code: rawArray = rawtextareaString.split(/\s+/g); . . . tempx = parseFloat(rawArray[k]); . . . sqAMatrix[i][j] = tempx; . . . Before I rush out and revise all my code to incorporate these suggestions, are there are concerns I should be aware of? Gotchas? Compatibility issues? Should I even bother? Hello. I have a page that has bunch of moving elements, and obviously I want the movement to be smooth. It worked just great in chrome, but very chunky in firefox. I ran a profiler, found the bottleneck and dealt with it, so things work fine now, but after seeing the result of profiler I now have few questions: The function that is responsible for moving elements around takes 33% of time. Here's the code: Code: Tile.prototype.relocate=function(x,y){ this.elem.style.left=this.x=x; this.elem.style.top=this.y=y; } It's called from timer (setInterval) for elements that are not where they should be (they have .style.position set to "relative"). Is there a better way of moving elements around? Another function: Code: function type(code){ return code>>8; } It takes 13% of time. Now this is just ridiculous. 181854 binary shifts take 174.579ms. Is there a way to make it look like a function call but just replace the call with actual code at compile time, just like C's preprocessor? Hi, im sorta a newbie but have a few questions i cannot find online anywhere. By the way im trying to create a chrome extension . Its a fairly simple extension, all i want it to do is select a few buttons automatically when the page is loaded. Without me having to click anything. A bot persay. How to automatically select a button/drop down menu How to save a form How to submit a form to a website How it works if you dont get it? Selecting a certain size like S/M/L, color, or anything of that nature AUTOMATICALLY WITHOUT HAVING TO CLICK ANYTHING. Which then adds to my cart. Thats all i want it to really do. Thanks for reading. I have a few buttons on a page I'm developing and I want the onclick event to call a javascript function in an external file and execute it. I would like to be able to pass a parameter to that function and then either have the function take the user to a new URL or make changes to the webpage content. Initially (just to test) I had inline javascript that caused an alert to popup. That worked fine. Next I took the inline code and put it in a function in an external javascript file that was referenced in the HTML: Code: <script type="text/javascript" src="../assets/js/ews-js.js"></script> <a link="www.xx.com" class="sk-shop-button" onClick="onclick_shop_button">Shop for Supplies</a> The function is as follows: Code: function onclick_shop_button() { window.alert('Life Is Good!'); return false; } When I attempt to call it this way nothing happens. I'm guessing I should not be using a link there since I have to build the URL inside the Javascript (for now though the Javascript is just showing an alert). In one use case I want to be able to pass a parameter which would contain a product name so the function could load the correct webpage. So the function would have to build the URL using the product name as part of the URL then load that page. In a different use case (for a different button) the user would click on an EDIT button that would then update parts of the webpage allowing the user to click on areas to delete content. I am not sure how to implement either use case. I know I can use CSS to modify the look of the webpage and then use subsequent onclick events to do the deleting but am not sure how to delete HTML from within Javascript. Same with how to go to a new URL from within Javascript. Finally I am not sure why the inline Javascript works but the external does not. Any help would be GREATLY appreciated! more or less when a user has a command pop up in this prompt they are asked to type another item from a list with an okay or cancel at the bottom how do i stop the script if a user hits cancel and move onto the calculation step and by pass the other imput prompts? sorry if this isn't the clearest, i am new at javascript. THanks in advance. Hello! I have a few simple questions and I'm not having any luck with my Google searches. Any information is appreciated! Pardon my pseudo-coding... It's the simplest way to describe what I'm looking for. 1. I have a two dimentional array called List. I want to write a for loop to loop through the first dimension of the array. How is this done? Code: for (Line in List[][]) { write ( List[Line][1] + " = " + List[Line][2] + "<br/>"); } 2. Is there a simple example of how to create and use an object with multiple properties, functions, etc? For example, the following "person" object: Code: Person as object - property FirstName as string - property LastName as string - function Name = property FirstName + " - " + property LastName - property Children[] as array of Person objects - property Gender as string - property Mate as Person object - property DOB as date 3. Can enumeration be done easily in Javascript? Code: enum StatusFlags blank as 0 new as 1 free as 2 reserved as 4 sold as 8 endedum enum StatusDecoration new as "bold" old as "normal" free as "green" notfree as "red" reserved as strikethrough"" unreserved as "no-strikethrough" sold as "italics" unsold as "no-italics" endenum Thanks! Hello everyone. I just came across a customer that wants me to place 1 video and 1 swf image player in the same place on there website. I tried this with a div layer where i put the video over the swf image but with a different monitor it would move. I did have a time out process of 2.1 mins. Does anyone know of any code that i could put in that would show the video for the time and when it finished it would show the swf images? If so can you tell me how to do this or help me with the code? If you need to see the current code it is simple just straight html done by a different coder. I would of done it with a css but he didn't want to. If you know of a way let me know. |