|
JavaScript - A Very Basic Javascript Question
Hello All
Its my first post on this forum. I have a database setup with tables that use my form element names as column names. Now i have successfully retrieved column names and values from the server side to the client side. . I have the column name stored in var columnName How can I get the type of form element type and how can i set the value to it Thanks for your help #Javalove. . .unless otherwise stated. . .! Similar TutorialsHi I'm new to javascript and have a simple question I'm sure somebody can help me with. I have a contact page on my website and trying to validate an email address, but can't get it to work. I want to validate that my fields have been field out and as well, want to validate the email address. Validation of the forms works, however I can't get the email validation working.. What am I doing wrong? <div style="text-align:right;"> <form id="contact" action="contact.php" method="post" autocomplete="off"> <label><em>Name: </em><input type="text" id="name" name="name" class="input"/></label> <label><em>Email : </em><input type="text" id="email" name="email" class="input"/></label> <label><em>Message : </em><textarea name="message" id="message" cols="35" rows="5"></textarea></label> <label>CC Me: <input type="checkbox" name="cc" value="cc"></label> <input type="submit" class="button alignright" name="submit" id="submit" value="Send" style="margin:0"/> </form> </div> <script type="text/javascript"> var filter=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i ; $("#contact").submit(function(ev) { if (!(filter.text($email) | ($("#name").val() == "" | $("#email").val() == "" | $("#message").val() == "") )) { $.lightbox().shake(); ev.preventDefault(); } }); </script> Just a basic question.... I am fairly new here. Just wondering if this is just a part of life. It seems like when I load javascript code into a page, that each item I add, such as an accordian vertical navbar, image slider, etc, that each time I add one, the page loads a second or so slower with each one added. I would like some of these features, but is this just a part of life, or are there tricks to avoid the slower load time? It is not major time but after the 2 items I mentioned, it added on about 2 seconds. Just enough to make it a bit annoying. I read that $(document).ready(function() might slow me down but I do not see that statement in any of my .js files. Thanks, Buffmin. Hi, I've just started learning JavaScript - actually started about half an hour ago. I have an extensive knowledge of Lua (if you've heard of it), so the concepts of programming aren't new to me. This code isn't doing anything. The HTML code makes the hyper-linked pictured show, but it doesn't do anything when the mouse rolls over it. The JavaScript code is saved in scripts/titleImage_rollover.js, and I'll show the HTML code as well. JavaScript: Code: <!--
// image rollover for header
function image_rollover(){
//show a set of random images
switch(math.floor(math.random()*5+1))
{
case 1:
document.getElementById("logo").src = "images/t2m_logo.png";
break;
case 2:
document.getElementById("logo").src = "images/pighead10_halloween.png";
break;
case 3:
document.getElementById("logo").src = "images/pighead10_easter.png";
break;
case 4:
document.getElementById("logo").src = "images/pighead10_classic.png";
break;
case 5:
document.getElementById("logo").src = "images/pighead10_combat.png";
break;
}
}
//reset image to normal
function image_reset(){
document.getElementById("logo").src = "images/pighead10.png";
}
//-->
HTML: < 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>pighead10.com | Home</title>
<style type="text/css">
.link1 A:link{text-decoration:none;}
.link1 A:visited{text-decoration:none;}
.link1 A:active{text-decoration:none;}
.link1 A:hover{text-decoration:underline;color:blue;}
</style>
<script type="text/javascript" src="scripts/titleImage_rollover.js"></script>
</head>
<body style="font-family:arial;color:red">
<a href="http://www.roblox.com/User.aspx?ID=2969907">
<img id="logo" src="images/pighead10.png" width="150" height="200" onmouseover="image_rollover()" onmouseleave="image_reset()"/>
</a>
</body>
</html>
Also, is there a way to view some kind of output in JavaScript? Hey guys! New user here and I just need a little help with some basic Javascript I must write a function that 'shows' the corresponding part of the form depending on what the user has selected. So... for example, if I select 'Pizza', the div #section2 with the question about Pizza type should be shown. All the sections that are not selected should be hidden. For example, if 'Mexican' is selected, the sections for 'Pizza' and 'Thai' should be hidden. I want this function to also display a message in the JavaScript console indicating which food type is selected. Apparently I'm supposed to use 'console.log("")'??? I'm using an external javascript file called prac8.js If anyone has any idea how to do this I'd be very greatful Code: <!DOCTYPE html>
<html>
<head>
<title>Prac 8 example</title>
<script type="text/Javascript" src="prac8.js"></script>
<style>
#section2, #section3, #section4 {
display:none; border:1px solid gray; padding:8px; margin-top:12px; width:400px;
}
#dessertmsg {
color:green;
}
</style>
</head>
<body>
<h1>Prac 8 example</h1>
<h2>A Food Survey</h2>
<form id="survey" action="#" method="post">
<div id="section1">
<label for="food">What is your favourite type of food?</label>
<select id="food" onchange="selection()">
<option value="pizza">Pizza</option>
<option value="mex">Mexican</option>
<option value="thai">Thai</option>
</select>
</div>
<div id="section2">
What is your favourite type of pizza?<br>
<label for="hawaiian">Hawaiian</label><input type="radio" id="hawaiian">
<label for="supreme">Supreme</label><input type="radio" id="supreme">
<label for="vegetarian">Vegetarian</label><input type="radio" id="vegetarian">
</div>
<div id="section3">
What is your favourite Mexican food?<br>
<label for="burrito">Burritos</label><input type="radio" id="burrito">
<label for="chilli">Chilli con carne</label><input type="radio" id="chilli">
<label for="taco">Tacos</label><input type="radio" id="taco">
</div>
<div id="section4">
What is your favourite Thai food?<br>
<label for="stir">Stir-fry</label><input type="radio" id="stir">
<label for="noodle">Noodles</label><input type="radio" id="noodle">
<label for="curry">Curry</label><input type="radio" id="curry">
</div>
<label for="dessert">What is your favourite dessert?*</label>
<input type="text" id="dessert" onchange="checkForm()"><br>
<div id="dessertmsg"> </div>
<input type="submit" value="Submit" id="subbutton" disabled>
</form>
</body>
</html>
Hi, I'm trying to create a video box on a website that plays a youtube video and then automatically plays random recommended videos with no break in playback. An endless playlist created by youtube based on the initial video. Youtube uses Javascript API. I have never used Javascript before but i'm just trying to get the video to play as above. There are few tutorials online and I couldn't find anyone trying to do a similar thing. If you have any idea how i'd go about it or if not where i could find some information to help. Thanks. Hey guys. I am pretty new to JS and programming. The company that I am working for put me on this project and I have a question. Here is a snippit for a form that we have. We use a dreamweaver extension "HDW form to database" to process the forms and put them in a mysql database. the wpform() is a validation function that has been written. what I want, is the fallowing, if you look at the code below in the option object, there are different categories... rock, funk, hip hop, synth etc. i want it so when one of them is selected, it goes to a different respected page. for example, if the value Rock is selected, and you press submit, it would take you to www.google.com . On the other hand if the value Funk is submitted, it will take you to www.yahoo.com . Code: <form action="/HDWFormToDatabase/FormToDatabase.php" method="post" name="theForm" onSubmit="return wpform()" accept-charset="iso-8859-1">
<select size="1" name="genre">
<option selected="selected" value="genre">Choose a Genre!</option>
<option value="Rock">Rock</option>
<option value="Funk">Funk</option>
<option value="Hip Hop">Hip Hop</option>
<option value="80s">Synthesizer</option>
<option value="Techno">Techno</option>
</select>
<input type="hidden" name="hdwok" id="hdwok" value=" URL GOES HERE" />
</form>
Normally, when this option object is not present, the user presses submit and after the form gets processed to the database, the browser forwards to the "URL GOES HERE" value. However, I am not sure exactly what to do now since the URL which it is forwarded to will change. can someone give me a hint on how to make this happen? just some general advice for a newb? I would write it but I am pretty lost. I was thinking of including a if statement in the wpform() function that goes something like: Code:
if (document.theForm.genre.selectedIndex == 0)
{
alert("Please select your genre.");
document.theForm.genre.focus();
return (false);
}
if (document.theForm.genre.selectedIndex==1)
{
window.location = "http://www.google.com/";
return(true);
}
if (document.theForm.genre.selectedIndex==2)
{
window.location = "http://www.yahoo.com/";
return(true);
}
etc etc Would this work? Is there a more efficient way of doing something like this that I should know of due to my lack of JS skills? Thanks in advance so much for help. This must be very simple. I want to execute some javascript only if an element is not displayed What is the syntax? if("#element:hidden) { do something like show it } Help much appreciated. I'm stumped. I realise it's something basic... This works - i.e. beeps on mouseover: Code: <html>
<head>
<script>
function EvalSound(soundobj) {
var thissound= eval("document."+soundobj);
thissound.Play();
}
</script>
</head>
...
<a href="#" onMouseOver="EvalSound('sound1')">Move mouse here</a>
...
<embed src="beep.mp3" autostart=false width=1 height=1 name="sound1" enablejavascript="true">
</body>
</html>
...but this doesn't work: (I get the error "undefined is null or not an object") Code: <html>
<head>
<script>
function EvalSound(soundobj) {
var thissound= eval("document."+soundobj);
thissound.Play();
}
</script>
</head>
...
<script language="JavaScript">
<!--
EvalSound('sound1');
change_it1() // activates an external .js
//-->
</script>
...
<embed src="beep.mp3" autostart=false width=1 height=1 name="sound1" enablejavascript="true">
</body>
</html>
What am I doing wrong? Gotta make the second idea work... Thanks 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. Hi guys, I am new to learning javascript and have a test tomorrow on for loops. I know the answers to the three following loops but i wondered if anyone could take the time to explain to me how to find the answer from the code as I have no idea on how to find the answers (the answer is what is displayed in the alert). Many thanks, Mike The loops are these three: 1. var a=4;b=6; for(var c=0;c<=a;c++){b=b+c;} alert(b); (answer is 16) 2. var v=1; for(i=1;i<5;i++) for(j=2;j<5;j++) v+=1; alert(v); (answer is 13) 3. var s=0; for(i=0;i<=8;i++) if((i%2)==0)s+=1; alert(s); (answer is 5) hi all, just got to make a basic form for my assignemment but i cant seem to get it to work. please could somebody point me in the right direction? thank you Code: <head>
<script type="text/javascript">
function make(myform)
{
var name = form.nameinput.value ;
var age = form.ageinput.value ;
var location = form.locationinput.value ;
var z = form.team.selectedIndex ;
var team = form.team.options[z].value;
alert("Thank you " + name + ".Good luck supporting " + team + );
}
</script>
</head>
<body>
<form method="get" action="" name="myform">
<h2>Order form</h2>
<fieldset>
<p>Please enter your details</p>
Name: <input type="text" value="" name="nameinput"/><br/>
Age: <input type="text" value="" size="2" name="ageinput"/><br/>
Location: <input type="text" value="" name="locationinput"/>
<p>Choose your favourite football team</p>
<select name="team">
<option value="arsenal">Arsenal</option>
<option value="aston_villa">Aston Villa</option>
<option value="birmingham_city">Birmingham City</option>
<option value="blackburn_rovers">Blackburn Rovers</option>
<option value="bolton_wanderers">Bolton Wanderers</option>
<option value="burnley">Burnley</option>
<option value="chelsea">Chelsea</option>
<option value="everton">Everton</option>
<option value="fulham">Fulham</option>
<option value="hull">Hull</option>
<option value="liverpool">Liverpool</option>
<option value="manchester_city">Manchester City</option>
<option value="manchester_united">Manchester United</option>
<option value="portsmouth">Portsmouth</option>
<option value="stoke_city">Stoke City</option>
<option value="sunderland">Sunderland</option>
<option value="tottenham_hotspur">Tottenham Hotspur</option>
<option value="west_ham">West Ham</option>
<option value="wigan_athletic">Wigan Athletic</option>
<option value="wolverhampton_wanderers">Wolverhampton Wanderers
</option>
</select>
</fieldset>
<input type="button" onclick="make(this.form)" value="Submit Details" name="button"/>
</form>
Hi, I'm very much a newbie regaridng javascript and have been looking around and experimenting and have created a javascript although it does not function(Javascript code below), can someone help me fix it? Many Thanks. function gotoURL(){ var newURL = document.GotoForm.theURL.value if (newURL == "info1" || "info2" || "info3" || "info4" || "info 5"){ document.location.href=newURL+".html" }else{ alert("You entered an invalid value"); }} Hi so i am using onClick="myPopup(); on a button and when someone clicks on the button, it pops up an advertisement in a new tab. But is there a way to make the users stay on the page where the button is located instead of forcing the browser to automatically switch to the advertisement tab when a button is clicked? I have a basic scroller list code, which works when I use it on a HTML page. However if I duplicate it and change the text, only one of the lists functions. I even tried to use a script from a free website online and duplicate that on the page and it still does not work twice. Could somebody help with this? I'm building a website to catalog a history of college football uniforms, and having something like this on several of the pages would be extremely helpful. I've been told that making it in Javascript instead of Flash would be better for my website. I've also been told that it should be relatively easy to write the code for it. In short, I want to be able to take the parts of this image and allow viewers of the site to be able to switch between parts to mix and match. There are quite a few teams with six or more possible uniform combinations, so I'd like to be able to do this for the site. This would probably be a good way to get my start on learning at least some Javascript basics, so would anyone be willing to help me put this together? Hello, I am a computing pupil currently taking part in a computer science project at GCSE level. Our project is a research task regarding web form validation, JavaScript and embedding JavaScript into HTML code. I have no prior knowledge of any of these topics, so would be very interested in hearing your opinions on the aboce. I would also like to know your opinion on how effective JavaScript validation is, possibly in your field of work, or just your experience of using it? Thanks in advance, Ellen Hello, Is there a way with JavaScript to easily detect which mobile browser is being used? I would not normally ask this, but because we do not have the time or budget to implement any back end detection scripting it is our only option right now! I don't think we will need to detect which version of the browser, or which revision of the phone is used - just need to target each family to deliver the proper video type. I'm trying to figure out this question that was assigned to me, as I haven't done alot on javascript before but I've tried to get most of this, I'm just not sure if this is correct. If anybody could help it would be greatly appreciated. The question is as follows: You are provided with a string array called country that contains the name of every country that the Ski Club visits. For example one element of this array might be as follows: country[0] = "Austria" Another array called villages contains strings with information on village names and altitude in a particular country. For example: villages[0] = "Austria:Seefield 850m*"; Write a JavaScript function snowReport(countryIndex) that will use the arrays provided to write a report of all villages that include a given country. The function will be passed an integer representing the index of an element of the country array. A match is found if the country appears in a string (Hint use appropriate JavaScript function to evaluate if a country name is contained in a village string.) All matching villages should be displayed. Output should be displayed in the villages div element you defined in part (a). Output is shown for a search for Austria in Figure 1b. <script type="text/javascript"> function makeArray() { var country = new Array(5); country[0] = "Austria"; country[1] = "Canada"; country[2] = "France"; country[3] = "Germany"; country[4] = "Switzerland"; return country; var villages = new Array(2); villages[0] = "Austria:Seefield 850m*"; villages[1] = "Austria:Ellam 100m"; return villages; } function snowReport(countryIndex){ var string = ""; for (var i = 0; i < countryIndex.length; i++){ str += countryIndex[i] + " "; } return str; } </script> </head> <body> <script> var x = makeArray(); document.write(snowReport(x)); </script> </body> </html> Many thanks! So erm. Hello there. I fail at javascript, and yet, I'm trying it. Anyways, I'm working on this thing. It's an extension for google chrome very similar to firefox plugins and so on. I'm making an extension so that, when installed, it changes the look of facebook completely. I have successfully changed the colors. However, I am having some trouble getting my javascript to change images. If anybody out there has some insight on what I'm doing wrong, I am glad to accept any kind of help that anyone is willing to give me, lol. What I've done so far: I have to change the facebook logo (what I'm trying to do now) and then change the links, and very few more things, and I'm done. Problem: I can't figure out how to change the image. I can change the background color, as you saw earlier. I just need a code to change the image. The CSS behind it is: Code: #pageLogo a{background:#3b5998 url(/rsrc.php/z8S5R/hash/ez3x5cuc.png) no-repeat -21px 0;display:block;position:absolute;height:31px;left:-6px;width:103px;top:10px}
and the HTML implementing it is: Code: <h1 id="pageLogo"><a href="http://www.facebook.com/?ref=logo" title="Home" accesskey="1"></a></h1> and my structure of javascript is: Code: for(i=0;i<=document.getElementsByTagName("div").length;i++)
{
if(document.getElementsByTagName("div")[i].id != null)
{
if((document.getElementsByTagName("div")[i].id=="blueBar"))
{
document.getElementsByTagName("div")[i].style.backgroundColor='#B22222';
}
if(( document.getElementsByTagName("div")[i].id == "headNavOut"))
{
document.getElementsByTagName("div")[i].style.backgroundColor='#8B0000';
}
}
}
});
I appreciate any help anyone's willing to give. Hey Guys, I was creating an image map with rollover images. I was just wondering if I could add a fade effect to the transition. The underarms is the only rollover that works at the moment. Please check the source code for the code because it's too long to post here. http://wedezign.com/chris/ |
|||||||