JavaScript - Javascript Multiple If Operators

I'm trying to get an emerge effect using javascript.
Here is my code
Code:

var t;
var s=0;
function emerge()
{
document.getElementById('my_span').style.opacity=s;
s=s+0.1;
t=setTimeout("emerge()",250);
if (s>1)
{
clearTimeout(t);
}
}
}

Works fine, does the things right.

But if I use this code, I get error.
Code:

var t;
var s=0;
function emerge()
{
document.getElementById('my_span').style.opacity=s;
s=s+0.1;
t=setTimeout("emerge()",250);
if (s==1)
{
clearTimeout(t);
}
}
}

The only thing I changed was comparison operator.

I tried to debug by adding alert box
Code:

var t;
var s=0;
function emerge()
{
alert(document.getElementById('my_span').style.opacity);
document.getElementById('my_span').style.opacity=s;
s=s+0.1;
t=setTimeout("emerge()",250);
if (s>1)
{
alert("Opacity set to max");
clearTimeout(t);
}
}
}

For some reason, it does not enter the if block if I use "==" operator & the alert box keeps coming up with "1" in it.
But works fine if I use ">" operator, enters the block and the last value it shows is "0.9".

Can anyone explain as to why this happens?

Store Information to multiple textboxes from database


Code:

$count=<mysql_num_rows($query1);

for($i=0;$i<mysql_num_rows($query1);$i++)
      {
        $row1=mysql_fetch_array($query1);
        $getval[$i]=$row1[UserId];   
	 Print "<input type=text name='txtbox[]' id='txtbox[]' value='.$getval[$i].'">;
      }

then i call a javascript function

Print "<script language=javascript>Call_Fun($count)</script>";


The above code store data into textbox and call the js function

in .js file


Code:

function Call_Fun(count)
{
	for(var i=0;i<count;i++)
	{
		alert(document.getElementbyId('txtbox')+i.value);
	}
}

But it doesn't retreive values in .js

Thankyou all

Hello, I have a script I am using which works great, except when I copy the code and have multiple events it only shows the first one. This I believe is because it's calling the first class name of it's kind. I want the class's to be named the same thing (css styling) and because the site is going to be dynamically driven, but is there a way to modify my script so that instead of looking for the first class it recognizes the right class associated with the button clicked. If anyone can help me fix this problem I am having I would be most appreciative..

Code:

<script language="javascript"> 
function toggle() {
	var ele = document.getElementById("commpopup");
	if(ele.style.display == "block") {
    	ele.style.display = "none";
  	}
	else {
		ele.style.display = "block";
	}
} 
</script>

<div class="togglecomment">
     <div class="popup" id="commpopup">
          <div class="commentbtn"><a href="#"><img src="images/commenticon.png" align="absmiddle" />Comment</a></div>
     </div>
     <div class="button"><a href="javascript:toggle();"><img src="images/comment_btn.jpg" /></a></div>
</div>

Hi,

I am looking for a multiple countup or age timer within a html page (using javascript). I want to display below each child picture the age clock/counter of the child. I do not know javascript well (I recognize some code) and know a little of html. I have searched on internet and nothing seems to get close to the below functionality. There are plenty of countup counters etc, but mostly count days, and those that do count age are single use only. Below is some code my friend found. That code works for one person/age only and includes weeks. The thing is that I want one page with all the children listed.

Example of Expected Outcome:

Picture John born in Thailand
John is 10 years, 03 months, 16 days, 12 hours, 14 minutes, 03 seconds old.

Picture Mary born in Florida, USA
Mary is 08 months, 12 days, 14 hours, 02 minutes, 53 seconds old.

Picture Chris born in Melbourne, Australia
Chris is 04 years, 02 months, 03 days, 01 hours, 06 minutes, 12 seconds old.

Picture Lindy born in The Netherlands
Lindy is 03 years, 11 months, 24 days, 23 hours, 44 minutes, 23 seconds old.

And the clocks keep ticking and counting up.

Please note that since Mary is less than a year old, the 0 year value does not show.

I also would like the possibility to consider the time differences between the places they were born and the time zone the web page viewer is in. Is that possible? Or maybe I have to recalculate their GMT (Greenwhich time zone) birth time for that to work, or maybe the time zone of the server? How can we make that accurate?

The hours, minutes, and seconds, would be great, but is of course optional. The code below also shows weeks, which is up to you to use or not. Maybe the script can allow you to choose which values to show?

I would like this for at least four children, but the possibility to add more later by copying some code would be great.

This is not an online form, so all time/date of birth details can be set in the script.

Here is the script I found:
Code:

<!-- Copy and Paste into HEAD of HTML-->

<SCRIPT type="text/javascript" language="JavaScript">

function ElapsedTime(inFromDate,inToDate) { 
var inFromDate = (arguments.length == 0) ? new Date() : arguments[0]; 
var inToDate = (arguments.length == 1) ? new Date() : arguments[1]; 

// if (arguments.length == 0) var inFromDate = new Date(); // IE4 has a bug in constructors, 
// if (arguments.length == 1) var inToDate = new Date(); // so use above method. 

var fromDate = new Date(inFromDate); 
var toDate = new Date(inToDate); 

var tempDate = new Date(); 
if (fromDate.getTime() > toDate.getTime()) { 
tempDate = new Date(fromDate); 
fromDate = new Date(toDate); 
toDate = new Date(tempDate); 
} 
var totMonths = 12*toDate.getFullYear() + toDate.getMonth() + 
-12*fromDate.getFullYear() - fromDate.getMonth() 
var years = Math.floor(totMonths / 12) 
var months = totMonths - 12*years 
if (dateAsNumber(toDate,"D") < dateAsNumber(fromDate,"D")) months -= 1 
if (months < 0) { 
months = 0 
if (years > 0) years -= 1 
} 

var yearsOff = years + fromDate.getFullYear() 
var monthsOff = months + fromDate.getMonth() 
if (monthsOff >= 12) { 
monthsOff -= 12 
yearsOff += 1 
} 
var tempDate = new Date(fromDate); 
tempDate.setFullYear(yearsOff); 
tempDate.setMonth(monthsOff); // might push us into early next month, so... 
while (tempDate.getDate() < fromDate.getDate() && tempDate.getDate() < 9 ) 
tempDate.setTime(tempDate.getTime() - 1000*60*60*24); // Feb 29 etc. 

var milliSecs = toDate.getTime() - tempDate.getTime(); 
var oneSecond = 1000; 
var oneMinute = 60 * 1000; 
var oneHour = 60 * oneMinute; 
var oneDay = 24 * oneHour; 
var oneWeek = 7 * oneDay; 
var weeks = Math.floor(milliSecs / oneWeek); 
milliSecs -= weeks * oneWeek; 
var days = Math.floor(milliSecs / oneDay); 
milliSecs -= days * oneDay; 
var hours = Math.floor(milliSecs / oneHour); 
milliSecs -= hours * oneHour; 
var minutes = Math.floor(milliSecs / oneMinute); 
milliSecs -= minutes * oneMinute; 
var seconds = Math.floor(milliSecs / oneSecond); 

var timeValue = ""; 
if (years) timeValue += years + ((years==1) ? " year, " : " years, "); 
if (months) timeValue += months + ((months==1) ? " month, " : " months, "); 
if (weeks) timeValue += weeks + ((weeks==1) ? " week, " : " weeks, "); 
if (days) timeValue += days + ((days==1) ? " day, " : " days, "); 
var timeValueDays = timeValue.substring(0 , timeValue.length - 2); 
timeValue += hours + ((hours==1) ? "hour, " :" hours, "); 
timeValue += minutes + ((minutes==1) ? " minute, and " : " minutes, and "); 
timeValue += seconds + ((seconds==1) ? " second" : " seconds"); 

this.years = years; 
this.months = months; 
this.weeks = weeks; 
this.days = days; 
this.hours = hours; 
this.minutes = minutes; 
this.seconds = seconds; 
this.text = timeValue; 
this.textDays = timeValueDays; 
} 

function dateAsNumber(inDate,inWhat) { 
var what = "", yearBit = 0, monthBit = 0 
if (typeof(inWhat) == "undefined" || inWhat.toString() == "" || inWhat.toString() == null) inWhat = "" 
what = inWhat.toString().toUpperCase() 
if (what != "M" && what != "D") // we want yyyy bit 
yearBit = inDate.getFullYear() * Math.pow(10,13); 
if (what != "D") // we want month bit 
monthBit = inDate.getMonth() * Math.pow(10,11); 
return yearBit + 
monthBit + 
inDate.getDate() * Math.pow(10,09) + 
inDate.getHours() * Math.pow(10,07) +
inDate.getMinutes() * Math.pow(10,05) + 
inDate.getSeconds() * Math.pow(10,03) + 
inDate.getMilliseconds() 
} 

//  *****  SET the DATE and TIME HERE  ***** 
//  ( Remembering that in Java Dates, 
//       months go from 0 (Jan) to 11 (Dec) ) 

function ageClock() { 
var leaveDate = new Date(2009,02,04,14,20) // for 2009 March 04, 7:31am 
var now = new Date(); 
var elapsed = new ElapsedTime(leaveDate,now);
return elapsed.text;
}

function getElement(id) {
return document.all ? document.all(id) : 
document.getElementById ? document.getElementById(id) :
document.layers ? document.layers[id] : 
null;
}

function centerShowIt(id) {
var winMid, aD = getElement('ageDisplay');
if (!aD) return;
if (window.innerWidth) winMid = innerWidth/2;
else if (document.body) winMid = document.body.clientWidth/2;
if (!document.layers) {
aD.style.left = winMid - aD.offsetWidth/2;
aD.style.visibility = 'visible';
} else {
aD.pageX = winMid - aD.clip.width/2;
aD.visibility = 'show';
}
}

function update() {
var text = ageClock();
var aD = getElement('ageDisplay');
if (!aD) return;
if (!document.layers) {
aD.innerHTML = text + ' ';
} else {
aD.document.write('<SPAN class="bodytext">' + text + ';</SPAN>');
aD.document.close();
}
setTimeout('update()',1000);
}

/* NS4 resize bug fix from webreference.com */
if (document.layers) {
origWidth = innerWidth;
origHeight = innerHeight;
}
if (document.layers) window.onresize = function() {
               if (innerWidth != origWidth || innerHeight != origHeight) 
               location.reload();
}
/********************************************/

window.onload = update;

</SCRIPT>

and

Code:

<!-- Copy and Paste into BODY of HTML where age is to appear-->

<SCRIPT type="text/javascript" language="JavaScript">
document.write('<DIV id="ageDisplay" class="bodytext">');
document.write(ageClock());
document.write('</DIV>');
centerShowIt('ageDisplay');
</SCRIPT>

Is there a solution somewhere?
Can anyone (re)write the script to fit above described functionality?
Any tips or referals?

Thanks

Pepin

hey all,

I am now at the point of being able to see the light at the end of the tunnel (woot!). After a lot of help from you guys I have tackled my RSS feed issue (sort of) to the point where i have a page that does basically what I need it to (http://www.the-rational-investor.com/test042311.php/).

I now need to incorporate this java script developed into the big picture and of course, there seems to be problems. Since I know it works on its own, I must be running into problems getting all the functions working simultaneously and I once again need to call on the board's brilliance in figuring out what I am doing wrong....so here it goes

I have taken out a lot of unnecessary code just to focus on the java script. Yes there is PHP code embedded but please don't beat up on me too much for that.
here is the main page code:
Code:

<head>

<?
// function for onmouseover to do ALL THREE tasks //
?>

<script type="text/javascript">
function doChanges(y){
var z= y; 
var imagevar = myimages[z];
var imagethis = this.href; 
changeimage(imagevar,imagethis);
changetext(z);
var x=y;
var rssfeedvar = myArrayRssFeed[x];
showRSS(rssfeedvar);
}
</script>

<?
// First Task - function for onmouseover TEXT //
?>

<script type="text/javascript">
function changetext(z){  
var s= z;
var textchangeEntries = myArrayEntries[s];
var id = document.getElementById("DBtext_large");
id.innerHTML=textchangeEntries;

var textchangeWebadr = myArrayWebadr[s];
var id = document.getElementById("DBtext_link").getElementsByTagName('a')[0];
id.nodeValue=textchangeWebadr;
id.setAttribute('href',textchangeWebadr);
id.innerHTML=textchangeWebadr;

var textchangeEmail = myArrayEmail[s];
var id = document.getElementById("DBtext_email");
id.innerHTML=textchangeEmail;

var textchangeRssUrl = myArrayRssUrl[s];
var id = document.getElementById("DBtext_rssUrl");
id.innerHTML=textchangeRssUrl;

var textchangeRssFeed = myArrayRssFeed[s];
var id = document.getElementById("DBtext_rssFeed");
id.innerHTML=textchangeRssFeed;
}
</script>

<?
// Second Task - functions for onmouseover IMAGES //
?>

<script type="text/javascript">
function changeimage(towhat,url){
if (document.images){
document.images.targetimage.src=towhat.src
gotolink=url
}
}
function warp(){
window.location=gotolink
}
</script>

<script type="text/javascript">

var myArrayEntries = ["<?php echo implode('","',$map_entry_array);?>"];
var myArrayWebadr = ["<?php echo implode('","',$web_adr_array);?>"];
var myArrayEmail = ["<?php echo implode('","',$email_adr_array);?>"];
var myArrayRssUrl = ["<?php echo implode('","',$rss_url_array);?>"];
var myArrayRssFeed = ["<?php echo implode('","',$rss_feed_array);?>"];

var myimages=new Array()
var gotolink="#"

function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++){
myimages[i]=new Image()
myimages[i].src=preloadimages.arguments[i]
}
}

preloadimages(<?echo("$qs1");?>);
</script>

<?
// Third Task - functions for onmouseover RSS FEED //
?>

<script type="text/javascript">
function showRSS(str)
{
if (str.length==0)
  {
  document.getElementById("rssOutput").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("rssOutput").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","getrss.php?q="+str,true);
xmlhttp.send();
}
</script> 
</head>

getrss.php is unchanged
Code:

<?php
//get the q parameter from URL
$q=$_GET["q"];

//find out which feed was selected
if($q=="http://twitter.com/statuses/user_timeline/53777622.rss")
  {
  $xml=("http://twitter.com/statuses/user_timeline/53777622.rss");
  }
elseif($q=="http://www.autisticsociety.org/rss/news2.php")
  {
  $xml=("http://www.autisticsociety.org/rss/news2.php");
  }
elseif($q=="http://sableresources.com/news/")
  {
  $xml=("http://sableresources.com/news/");
  }
elseif($q=="http://www.northgateminerals.com/rss/pressrelease.aspx")
  {
  $xml=("http://www.northgateminerals.com/rss/pressrelease.aspx");
  }
elseif($q=="http://www.thompsoncreekmetals.com/s/RSS.asp?MaxItems=4&Version=RSS2.0")
  {
  $xml=("http://www.thompsoncreekmetals.com/s/RSS.asp?MaxItems=4&Version=RSS2.0");
  }
elseif($q=="http://www.imperialmetals.com/s/RSS.asp?MaxItems=10&Version=RSS2.0")
  {
  $xml=("http://www.imperialmetals.com/s/RSS.asp?MaxItems=10&Version=RSS2.0");
  }
elseif($q=="http://investorrelations.walterenergy.com/corporate.rss?c=71978&Rule=Cat=news~subcat=ALL")
  {
  $xml=("http://investorrelations.walterenergy.com/corporate.rss?c=71978&Rule=Cat=news~subcat=ALL");
  }
elseif($q=="http://www.teck.com/framework/comp.aspx?portalName=tc&id=133613&rss=1")
  {
  $xml=("http://www.teck.com/framework/comp.aspx?portalName=tc&id=133613&rss=1");
  }
elseif($q=="http://www.tasekomines.com/tko/RSS.asp?MaxItems=10&Version=RSS2.0")
  {
  $xml=("http://www.tasekomines.com/tko/RSS.asp?MaxItems=10&Version=RSS2.0");
  }
elseif($q=="http://www.rocamines.com/s/RSS.asp?MaxItems=10&Version=RSS2.0")
  {
  $xml=("http://www.rocamines.com/s/RSS.asp?MaxItems=10&Version=RSS2.0");
  }
elseif($q=="http://www.breakwater.ca/rss/pressrelease.aspx")
  {
  $xml=("http://www.breakwater.ca/rss/pressrelease.aspx");
  }
  
$xmlDoc = new DOMDocument();
$xmlDoc->load($xml);

//get elements from "<channel>"
$channel=$xmlDoc->getElementsByTagName('channel')->item(0);
$channel_title = $channel->getElementsByTagName('title')
->item(0)->childNodes->item(0)->nodeValue;
$channel_link = $channel->getElementsByTagName('link')
->item(0)->childNodes->item(0)->nodeValue;
$channel_desc = $channel->getElementsByTagName('description')
->item(0)->childNodes->item(0)->nodeValue;

//output elements from "<channel>"
echo("<p><a href='" . $channel_link
  . "'>" . $channel_title . "</a>");
echo("<br />");
echo($channel_desc . "</p>");

//get and output "<item>" elements
$x=$xmlDoc->getElementsByTagName('item');
for ($i=0; $i<=2; $i++)
  {
  $item_title=$x->item($i)->getElementsByTagName('title')
  ->item(0)->childNodes->item(0)->nodeValue;
  $item_link=$x->item($i)->getElementsByTagName('link')
  ->item(0)->childNodes->item(0)->nodeValue;
  $item_desc=$x->item($i)->getElementsByTagName('description')
  ->item(0)->childNodes->item(0)->nodeValue;

  echo ("<p><a href='" . $item_link
  . "'>" . $item_title . "</a>");
  echo ("<br />");
  echo ($item_desc . "</p>");
  }
?>

Thanks again for all your wonderful help and all the best to you and your families on this Easter weekend,

Brian

I set up my javascript so that it shows a hidden div box from an array when i click on a link.

To show only one hidden box, the code is

<a href="javascript:showOnlyThis('divIDgoeshere')">

how do i show multiple hidden div boxes with one link?

Thanks!

Hello, I am new to javascript and have managed to create the below form with few fields validation that is working. I also have an email format validation function which is not working. Any help would be hightly appreciated. Below with the form with the javascript


<html>
<script language="JavaScript" type="text/javascript">
<!--
var radio_selection="";
function checkform ( form )
{
**// ** START **
**if (form.name.value == "")
{
****alert( "Please enter your name." );
****form.name.focus();
****return false;
**}
if (form.Phone.value == "") {
****alert( "Please enter your phone number." );
****form.Phone.focus();
****return false;
**}
**if (form.email.value == "") {
****alert( "Please enter your email." );
****form.email.focus();
****return false;
}
if (radio_selection=="")
{
alert("Please indicate your attendance.");
return false;
}
*// ** END **
**return true;
}

function checkEmail(form)
{
if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(form.email.value))
{
return true;
}
alert("Invalid E-mail Address! Please re-enter.");
return false;
}

//-->
</script>
<body>
<form style="font-family:lucida calligraphy;font-size:120%;color:maroon" action="invitees.php" method="post" onsubmit="return checkform(this);checkEmail(this.email.value);">

<table cellspacing="5" cellpadding="5" border="0">
<tr>
<td valign="top" >
<style="font-family:lucida calligraphy;font-size:100%;color:maroon">Name:
</td>
<td valign="top">
<input type="text" name="name" id="name" size="40" value="" />

</td>
</tr>
<tr>
<td valign="top">
Phone Number
</td>
<td valign="top">
<input type="text" name="Phone" id="Phone" size="40" value="" />

</td>
</tr>
<tr>
<td valign="top">
Email Address:
</td>
<td valign="top">
<input type="text" name="email" id="email" size="40" value="" />

</td>
</tr>
<tr>
<td valign="top">
Will You Attend
</td>
<td valign="top">
<input type="radio" name="Attendance" id="Attendance_0" value="Yes" onClick="radio_selection='yes'" /> Yes
<input type="radio" name="Attendance" id="Attendance_1" value="No" onClick="radio_selection='no'"/> No
<input type="radio" name="Attendance" id="Attendance_2" value="Maybe" onClick="radio_selection='maybe'"/> Maybe<br/>

</td>
</tr>
<tr>
<td valign="top">
Adults
<select name ="adults" id="Adults" >
<option>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option> <option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
<td valign="top">
Kids
<select name="kids" id="Kids" >
<option>0</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option> <option>8</option>
<option>9</option>
<option>10</option>
</select>
</td>
</tr>

<tr>
<td valign="top">
Post a Note
</td>
<td valign="top">
<textarea name="Note" id="Note" rows="6" cols="35"></textarea>

</td>
</tr>
<tr>
<td colspan="3" align="center">
<input type="submit" value=" Submit Form " />
</td>
</tr>
</table>
</form>
</html></body>

I have the following script that currently returns 4 of the same images. I can't wrap my head around how to get it to return 4 random images (out of the 7 in this example)? Also the links aren't working?

---
Code:

var imagenumber = 7 ;
var randomnumber = Math.random() ;
var rand1 = Math.round( (imagenumber-1) * randomnumber) + 1;

images= new Array
images[1] = "image1.jpg"
images[2] = "image2.jpg"
images[3] = "image3.jpg"
images[4] = "image4.jpg"
images[5] = "image5.jpg"
images[6] = "image6.jpg"
images[7] = "image7.jpg"
var image = images[rand1]

links= new Array
links[1] = "link1.html"
links[2] = "link2.html"
links[3] = "link3.html"
links[4] = "link4.html"
links[5] = "link5.html"
links[6] = "link6.html"
links[7] = "link7.html"
var link = links[rand1]

document.write('<div id="image-1"><a href="' + link + '"><img src="' + image + '"></a></div><div id="image-2"><a href="' + link + '"><img src="' + image + '"></a></div><div id="image-3"><a href="' + link + '"><img src="' + image + '" border="0"></a></div><div id="image-4"><a href="' + link + '"><img src="' + image + '"></a></div>')

---
Any help would be greatly appreciated!

Hi,

I've got a game 99% finished, basically when the game start and the player clicks through to the game panel, there are 30 tiles (80x80px) each, and the object of the game is for the player to press the tile with the letter "X" on, the X can be on any 1 of 5 different coloured tiles at anyone time and of course there can be more than 1 tile having an X on it. The tiles currently are built via .css, and this works 100% perfectly. However now I want to use images, pulled in from my local website instead of tiles built via .css.

A demo of what I'm kinda of after is here > Edit fiddle - JSFiddle - if you press "run" the images will keep changing their order.

The code I currently have for the game is here..


//CODE//

var TheColorArray = ['red', 'yellow', 'green', 'blue', 'orange'],
TheScore = 0,
TimerLength = 2500,
GameTimer,
ScoreMap = {
'red': 500,
'yellow': 50,
'green': 30,
'blue': 20,
'orange': 5
};

function DrawRow() {

TheColorArray.sort(function () {
return .5 - Math.random();
});

var TheHTML = '<div class="row">';

var MagicColumn = Math.floor(Math.random() * 6);

for (var i = 0; i < 5; i++) {

if (i === MagicColumn) {

TheHTML = TheHTML + '<div class="GameTile ' + TheColorArray[i] + '">x</div>';

} else {

TheHTML = TheHTML + '<div class="GameTile ' + TheColorArray[i] + '">' + String.fromCharCode(97 + Math.floor(Math.random() * 26)) + '</div>';
}
}

TheHTML = TheHTML + '</div>';

return TheHTML;
}


You'll also see that "TheHTML = TheHTML + '<div class="GameTile ' + TheColorArray[i] + '">x</div>';" and "TheHTML = TheHTML + '<div class="GameTile ' + TheColorArray[i] + '">' + String.fromCharCode(97 + Math.floor(Math.random() * 26)) + '</div>';" both state that if X is pressed the game basically carries on. I need this to use a chosen image from my server, i.e. URL/apple.png ....

i have also managed to get to this point (with apples) but its just not working.. Edit fiddle - JSFiddle

Any help would be great..

Many thanks in advance!!!

Hi All,
This is my first post and I need some assistance. I'm learning code and attempting to put more than 1 script on a webpage, but individual (separate pages) but together, neither one works.

I'm a newbie and my professor doesn't know how to teach so it's me trying to do this myself and any assistance will be helpful.

This is what I have (trying to add random pictures and a cycling banner)


<script>
var imgArray = new Array (4);
var index = 0;

function cycle ()
{
document.banner.src = imgArray[index].src;
index++;
if (index > 3)
{
index = 0;
}
setTimeout("cycle()", 2000);
return;
}

function startup ()
{
imgArray[0] = new Image;
imgArray[0].src = "Im.png";
imgArray[1] = new Image;
imgArray[1].src = "Tired.jpg";
imgArray[2] = new Image;
imgArray[2].src = "of this.jpg";
imgArray[3] = new Image;
imgArray[3].src = "Rainy.jpg";
cycle();
return;
}

</script>
</head>
<body onLoad="select();startup()">
<div align="center">
<img name="banner" src="Im.png">
</div>
</body>


</body>


<script>
var imgArray = new Array (5);
var index = 0;

function select ()
{
index= Math.floor(Math.random() * 5);
document.banner.src = imgArray[index].src;
setTimeout("select()", 2000);
return;
}

function startup ()
{
imgArray[0] = new Image;
imgArray[0].src = "1.jpg";
imgArray[1] = new Image;
imgArray[1].src = "2.jpg";
imgArray[2] = new Image;
imgArray[2].src = "3.jpg";
imgArray[3] = new Image;
imgArray[3].src = "4.jpg";
imgArray[4] = new Image;
imgArray[4].src = "sheep.jpg";
select();
return;
}

</script>
</head>
<body onLoad="cycle(); startup()">
<div align="center">
<img name="banner" src="1.jpg">
</div>
</body>

Hi,

I have a search function which works when I only want to have only one search per page, but as it involves a string call I'm not sure how to modify it to multiple search requests on a page.

The below works fine for one call:
Code:

<script type="text/javascript">
function showHint(str){
if (str.length==0){
	document.getElementById("txtHint").innerHTML="";
	return;
	}
if (window.XMLHttpRequest){
	xmlhttp=new XMLHttpRequest();
	}
	else{
	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

xmlhttp.onreadystatechange=function(){
	if (xmlhttp.readyState==4 && xmlhttp.status==200){
		document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
		}
	}

xmlhttp.open("GET","getName.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
				<label>Search by name: </label>
					<input type="text" id="txt1" class="input" onkeyup="showHint(this.value)" />
	<br />
	<p>Suggestions: <span id="txtHint"></span></p>
	<br />

But if I want to do mulitple I have tried changing it to:
Code:

<script type="text/javascript">
function showHint(File,ID){
if (str.length==0){
	document.getElementById(ID).innerHTML="";
	return;
	}
if (window.XMLHttpRequest){
	xmlhttp=new XMLHttpRequest();
	}
	else{
	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

xmlhttp.onreadystatechange=function(){
	if (xmlhttp.readyState==4 && xmlhttp.status==200){
		document.getElementById(ID).innerHTML=xmlhttp.responseText;
		}
	}

xmlhttp.open("GET",File,true);
xmlhttp.send();
}
</script>
</head>
<body>
				<label>Search by firstname: </label>
					<input type="text" id="txt1" class="input" onkeyup="showHint('GetFirstName.php?q='+str,'txtHint')" />
	<br />
	<p>Suggestions: <span id="txtHint"></span></p>
	<br />				<label>Search by surname: </label>
					<input type="text" id="txt1" class="input" onkeyup="showHint('getLastName.php?q='+str,'txtHintSn')" />
	<br />
	<p>Suggestions: <span id="txtHintSn"></span></p>
	<br />

The above doesn't work and I am not sure what do about the showHint(str) as clearly I am not representing it properly in my attempt to modify the script.

All

I am using my SOAP API using java script.

this example explain how to send single soap request using js

Code:

var symbol = "MSFT"; 
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "http://www.webservicex.net/stockquote.asmx?op=GetQuote",true);
xmlhttp.onreadystatechange=function() {
 if (xmlhttp.readyState == 4) {
  alert(xmlhttp.responseText);
  // http://www.terracoder.com convert XML to JSON 
  var json = XMLObjectifier.xmlToJSON(xmlhttp.responseXML);
  var result = json.Body[0].GetQuoteResponse[0].GetQuoteResult[0].Text;
  // Result text is escaped XML string, convert string to XML object then convert to JSON object
  json = XMLObjectifier.xmlToJSON(XMLObjectifier.textToXML(result));
  alert(symbol + ' Stock Quote: $' + json.Stock[0].Last[0].Text); 
 }


}
xmlhttp.setRequestHeader("SOAPAction", "http://www.webserviceX.NET/GetQuote");
xmlhttp.setRequestHeader("Content-Type", "text/xml");
var xml = '<?xml version="1.0" encoding="utf-8"?>' +
 '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ' +
                'xmlns:xsd="http://www.w3.org/2001/XMLSchema" ' +
                'xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">' + 
   '<soap:Body> ' +
     '<GetQuote xmlns="http://www.webserviceX.NET/"> ' +
       '<symbol>' + symbol + '</symbol> ' +
     '</GetQuote> ' +
   '</soap:Body> ' +
 '</soap:Envelope>';
xmlhttp.send(xml);
// ...Include Google and Terracoder JS code here...

Now i want to send multiple soap request at a time (mean request more than one envelop).

I am very new to javascript and cannot find any info anywhere regarding the following problem:

On my website I have around 100 pages containing an action form. Occasionally it is necessary to cancel the action throughout the 100 pages which is very time-consuming. Then the action has to be reinstated once again for all the 100+ pages. I thought the solution would be to use javascript to change the action from a .js file which would mean only one page, the .js file, would require alteration:

The action that appears on all 100+ pages several times that I am trying to change or stop happening by overwriting the "form action":

<form action="http://www.changenamecart.com/" method="post">
<input type="hidden" name="userid" value="1234567">
<input type="hidden" name="return" value="http://www.thehomepage.co.uk/index.htm">
<input type="image" src="http://www.changenamecart.com/images/pic.gif">
</form>


My efforts to date a

The change .js file:

function change()
{
var myChange = form action;

if(myChange == form action){
document.write("form xction");
}
}


The html file in the header:

<script src="change.js" type="text/javascript"></script>


I am afraid that my knowledge of programming is very small and I would welcome any help to solve this problem.

I'm trying to allow the user to change the stylesheet of my website. I can change the stylesheet on a page by page basis (eg. from red style to blue style) but once the user navigates to a different page the stylesheet resets back to the original setting.

For example, when the user visits the site first its set to the red style, they can change it to blue but when they navigate to another page the style goes back to red again where as I want the style to stick across pages.

Does anybody know how I can sort this out? I assume I'll have to edit my javascript but Im not very good at javascript so any help would be great!

HTML
Code:

<html>
<head>
<link href="red.css" rel="stylesheet"
type="text/css" title="red" media="screen" />
<link href="green.css" rel="alternate stylesheet"
type="text/css" title="green" media="screen" /> 
<link href="blue.css" rel="alternate stylesheet"
type="text/css" title="blue" media="screen" />

<script type="text/javascript">
function changeStyle(title) {
var lnks = document.getElementsByTagName('link');
for (var i = lnks.length - 1; i >= 0; i--) {
if (lnks[i].getAttribute('rel').indexOf('style')> -1 && lnks[i].getAttribute('title')) {
lnks[i].disabled = true;
if (lnks[i].getAttribute('title') == title) lnks[i].disabled = false;
}}} 
</script>


</head>
<body>
<a href = "home1.html">Page 1</a>
<br>
<br>
<a href = "home2.html">Page 2</a> 
<br>
<br>
<a href = "home3.html">Page 3</a> 
<br>
<br>
<br>
<br>
<a href = "#" onclick="changeStyle('red')">Red Stylesheet</a>
<br>
<br>
<a href = "#" onclick="changeStyle('blue')">Blue Stylesheet</a> 
<br>
<br>
<a href = "#" onclick="changeStyle('green')">Green Stylesheet</a> 
</body>
</html>

CSS
Code:

body
{
background-color:red;
}

is there some way to searching through multiple path or recursively searching through a path
(folders and subfolders) using the code below which seems to search only one node in the tree? Many Thanks.

there are basically subfolders in \documents and then subfolders therein.
i would like to search it therein for all kinds of files/filenames based on "search criteria".

one more thing - is it ok/advisable to use active x objects considering most modern browsers have it disabled or give warnings?

Code:

<script>
var Fo =new ActiveXObject("Scripting.FileSystemObject");
var StrOut = new String();
var FileName = new String();
var Extention = new String();

function FindFile(FOo)
{
	var FSo = new Enumerator(FOo.Files);
	for(i=0;!FSo.atEnd();FSo.moveNext())
	{
		if(FileName == "*" ||  FSo.item().name.slice(0,FSo.item().name.lastIndexOf(".")).toLowerCase().indexOf(FileName)>-1)
			if(Extention == "*" || FSo.item().name.slice(FSo.item().name.lastIndexOf(".")+1).toLowerCase().indexOf(Extention)>-1){
				StrOut += "<tr "+ ((i%2)? "":"bgcolor=#C4E3F2")  +"><td width=50%><font class=find>" + FSo.item().name + "</font></td><td width=25%><font class=find>" + FSo.item().type + "</font></td><td width=50%><font class=find>"+ String(FSo.item().size/(1024*1024)).slice(0,3) +" MB</font></td></tr>";
				i++
				}
	}
}

function Search()
{
	FileName = (search.value.lastIndexOf(".")>-1)? search.value.slice(0,search.value.lastIndexOf(".")):(search.value.length>0)? search.value.toLowerCase():"*"; //Get Searched File Name
	Extention = (search.value.lastIndexOf(".")>-1)? search.value.slice(search.value.lastIndexOf(".")+1).toLowerCase():"*"; // Get Searched File Extention Name

	if(path.value.length>0 && Fo.FolderExists(path.value)){
		StrOut = "<table border=0 width=100% cellspacing=0>"
		FindFile(Fo.GetFolder(path.value));
		outPut.innerHTML = StrOut+"</table>";
		}
	else alert("Insert Correct Path Address");
}
</script>

Code:

<BODY topmargin="0" leftmargin="0">

<table border=0 width=100% cellspacing="0" style="border-collapse: collapse" cellpadding="2"><tr>
	<td dir="ltr" bgcolor="#FFD9D9"><b><font face="Verdana" size="2">Filename :
    </font></b> </td>
	<td dir="ltr" bgcolor="#C4E3F2">
    <input size=50 type=text id=search name=search class="Find"></td>
	</tr><tr>
	<td dir="ltr" bgcolor="#C4E3F2">
      <p dir="ltr"></td>
	<td bgcolor="#FFD9D9"><input size=50 type=hidden value="\Documents" id=path name=path class="Find" >
	  <input type=button value="Search" onClick=Search() class="Find"></td>
	  
	</tr><tr>
	<td colspan=2 align=left bgcolor="#FFFFFF"><font face=Verdana size=2><b>Search Result</b></font><hr></td>
	</tr><tr>
	<td colspan=2 bgcolor="#FFFFFF"><div id=outPut></div></td>
	</tr></table>
</BODY>
</HTML>