|
JavaScript - How To Load An Jpg Image Into Variable With Xmlhttprequest?
Similar TutorialsSo I'm trying to make a free flash game site that is not completely annoying and never redirects you to another site. i'm hosting all my flash games on my server. when you select the game you would like to play, it loads the file name into a javascript variable that gets sent to my game.html where i would like the game to load. every game should load on this same page. I cannot for the life of me find how to read the variable in html. I've tried embed, object, documentwrite, basically everything i could find doing google searches for 10 hours. I'm no expert programmer, but I've never had to post a question to any forum EVER before because I always figure it out on my own. Not this time. i don't want to include any code i'm using because i would like the proper format. tell me what to do with it and i will do anything in my power to make you feel special. i'll devote a special page to you highlighting your genius on my site. this is a terrible example of what I'm trying to do, just imagine VARIABLEGOESHERE = mystinkingame.swf: [CODE] <object width="550" height="400"> <param name="movie" value="VARIABLEGOESHERE"> <embed src="VARIABLEGOESHERE" width="550" height="400"> </embed> </object> [CODE] it is also clear that i do not understand the [CODE] tag in your forum. Hi all I have a list of items that when you hover over them it displays an image (using CSS). This is fine when the list is small but when the list is large it takes a while to load all the images... this then delays any javascript on the page from running until all the images are loaded. Is there a way to either: * Use javascript to make it so the image only loads when the link is hovered over? or * Allow the rest of the javascript on the page to run before the images are finished loading? I think i'd prefer the first solution if possible but i'm open to all ideas. Thanks in advance! Hello everyone, I'm looking for a javascript script that will load a small image where the mouse is, then it would go away after a couple seconds. Thanks a bunch! Hi I'm an AS3 dev learning Javascript. I'm currently writing a simple script that loads an image as seen below. I deliberately misspell the file name to test the fail. Code: var fileName = "anImageThatDoesntExist.jpg";
var image = new Image();
image.onload = imageLoaded;
try {
image.src = "images/" + fileName;
} catch( error ) {
console.log('load error', error.message );
} finally {
console.log('unable to catch error!')
}
function imageLoaded( event ) {
console.log('image loaded');
}
When I run this script I was expecting the 'catch' to pick up the error and tell me that the file doesn't exist. The 'catch' statement is ignored and 'finally' is executed. I would be very grateful if someone could let me know if I'm writing the try/catch incorrectly or whether it doesn't work in this way when loading an image. Many thanks in advance.... Hi I have created the following page http://kylehouston.com/new/choir_contact.html I have added JQuery to smoothly fade in the screenshot on this page but on the first load the image gradually loads which misses out on the fade in effect. Is there a way I can load the image invisibly and then fade it in? Thanks in advance for your advice Kyle How can I make it to where an image will load in the corner of a website? Specifically, I have part of a template I want all people to see, however, some people either get it cut off or not shown at all because of their resolution. I'm trying to build a gallery. So far I've used jquery for the scrolling thumbnails. The problem I am having is deciding which would be the best way to load the larger version of the thumbnails into a div? Currently I am using a jquery attribute replace, but the only problem I'm having is I want to use lightbox for the large images. Some of the images have text so they need to be big if the user would like to read them. Right now lightbox is working except that it doesn't understand what image it's on when you click on the large version. I believe this is because of the attribute replace. Here is where you can view the problem: http://www.tsutsumidaphoto.com/Mihoko/akiko3.php If you click on any thumbnail after the first then click on the large version it will bring up the first image then go from there. Any suggestions, I've tried for too long on my own! I used DrDOS's solution from http://www.codingforums.com/showpost...17&postcount=8 and modyfied it a bit so I have 2 images, first without and 2nd with a link to other page. It works just fine in FF but in Chrome and in IE it shows just 2nd image. On place where first image shall be it's just blank white space. I have javascript enabled in all browsers, btw. Here's a code in head: Code: <script type="text/javascript">
function loadImg()
{
document.getElementById("loadimg").innerHTML="<img src=\"logo2.png\"";
}
function loadImg2()
{
document.getElementById("loadimg2").innerHTML="<a href=\"http://site.com\"><img src=\"logo2.png\"</a>";
}
</script>
And here's body part: Code: <div class="bottleft">
<div id="loadimg"></div>
<script type="text/javascript">var myimg = setTimeout("loadImg();",5000);</script>
</div>
<div class="bottright">
<div id="loadimg2"></div>
<script type="text/javascript">var myimg = setTimeout("loadImg2();",5000);</script>
</div>
I'm trying to figure out this whole day but just can't see where I am making a mistake? Hello, Can anyone figure out whats going on with this page and i need to finish the site by this evening? It is a wordpress site. the background image is shifting to the right on IE7 after the page loads on only the homepage. I think its the slider but im not sure www.grapevineoutreach.org thanks Basically I want an effect like this: http://www.appelsiini.net/projects/l...ed_fadein.html Where the images on the page fade in as the user scrolls down. I implemented the code on a page, he http://www.jamiewebster.co.uk/orca.html Now, I have a couple of issues with this. First issue, it works in FF but it doesn't seem to work in Chrome. Second issue, I can see the alt text of the images below just above the fold of the page before the image loads (I guess it depends on your monitor size on wether you'll see it or not, but its still a problem!) Thirdly, it seems that once the images have loaded, if you scroll back up you no longer have the fade effect and it only happens once (unless you refresh the page) - would be good if that effect could happen every time you scroll. Any ideas, or if there is better code out there? Thanks in advance!! Hello all. I'm sure this is really easy, but I have a question about being able to change a main image depending on a mouseover of particular text. I have a website where I am hosting a recipe, and I want to be able to show a 'main' picture that changes depending on where the user is hovering in the instructions. It would be very similar to this: http://piscesmike.com/Pages/recipes/onions.html The exception being that the top images are replaced by line by line instructions, and the main image changes depending on which instruction you are hovering on. Alternatively, I could also use a pop-up window with the image for the particular instruction, but could not get that to work either. I coded everything for the above link, but just cant seem to get this working. Any help is greatly appreciated. And, also feel free to try out the recipe's from PiscesMike.com, or to poke around. I know there are a few other errors (one being the day of the week deal) so once again, any input or help would be a tremendous help. Thanks and sorry for being such a noob! It must be a simple thing... I am trying to change an image source on page load depending on the contents of a cookie: Code: function goVisited(cookiename,img_name,img_src) {
var visited = readCookie(cookiename);
if (visited == "1"){
//alert("visited!");
document[img_name].src=img_src;
}}
<img onload="goVisited('main1','Introduction','img/Yellow.gif');" name="Introduction" border="0" src="img/Green.gif" width="250" height="18">
I need the page to check the cookie "main1" and if its value is 1, then change the image src from Green.gif to Yellow.gif. It almost works, but I get a stack overflow. Ok, basically I am using the script bellow to produce a javascript slideshow similar to this: http://www.valvesoftware.com/ but instead of the red boxes I want an image representing each slide. My problem is, I can't figure out how to call in a different image for each of these tabs (Paginates). Any help would be much appreciated, thanks. HEAD: Code: <style type="text/css">
/*<![CDATA[*/
#tst {
position:relative;width:880px;height:400px;
}
#paginate {
position:absolute;z-Index:4;left:760px;top:15px;height:20px;
}
#paginate .default {
position:relative;width:100px;height:50px;margin-bottom:27px;border:solid black 1px;background:url(images/imagehold.png);
}
#paginate .active {
background:url(images/imagehold_o.png);
}
/*]]>*/
</style><script type="text/javascript">
// Animate (24-June-2011)
// by Vic Phillips http://www.vicsjavascripts.org.uk
// To progressively change the Left, Top, Width, Height or Opacity of an element over a specified period of time.
// With the ability to scale the effect time on specified minimum/maximum values
// and with three types of progression 'sin' and 'cos' and liner.
// The functional code size is 1.39K
// **** Application Notes
// **** The HTML Code
//
// when moving an element the inline or class rule style position of the element should be assigned as
// 'position:relative;' or 'position:absolute;'
//
// The element would normally be assigned a unique ID name.
//
// **** Initialising the Script.
//
// The script is initialised by assigning an instance of the script to a variable.
// e.g A = new zxcAnimate('left','id1')
// whe
// A = a global variable (variable)
// parameter 0 = the mode(see Note 1). (string)
// parameter 1 = the unique ID name or element object. (string or element object)
// parameter 2 = the initial value. (digits, default = 0)
// **** Executing the Effect
//
// The effect is executed by an event call to function 'A.animate(10,800 ,5000,[10,800]);'
// whe
// A = the global referencing the script instance. (variable)
// parameter 0 = the start value. (digits, for opacity minimum 0, maximum 100)
// parameter 1 = the finish value. (digits, for opacity minimum 0, maximum 100)
// parameter 2 = period of time between the start and finish of the effect in milliseconds. (digits or defaults to previous or 0(on first call) milliSeconds)
// parameter 3 = (optional) to scale the effect time on a specified minimum/maximum. (array, see Note 3)
// field 0 the minimum value. (digits)
// field 1 the maximum value. (digits)
// parameter 3 = (optional) the type of progression, 'sin', 'cos' or 'liner'. (string, default = 'liner')
// 'sin' progression starts fast and ends slow.
// 'cos' progression starts slow and ends fast.
//
// Note 1: Examples modes: 'left', 'top', 'width', 'height', 'opacity.
// Note 2: The default units(excepting opacity) are 'px'.
// For hyphenated modes, the first character after the hyphen must be upper case, all others lower case.
// Note 3: The scale is of particular use when re-calling the effect
// in mid progression to retain an constant rate of progression.
// Note 4: The current effect value is recorded in A.data[0].
// Note 5: A function may be called on completion of the effect by assigning the function
// to the animator intance property .Complete.
// e.g. [instance].Complete=function(){ alert(this.data[0]); };
//
// **** Functional Code - NO NEED to Change
function zxcAnimate(mde,obj,srt){
this.to=null;
this.obj=typeof(obj)=='object'?obj:document.getElementById(obj);
this.mde=mde.replace(/\W/g,'');
this.data=[srt||0];
return this;
}
zxcAnimate.prototype={
animate:function(srt,fin,ms,scale,c){
clearTimeout(this.to);
this.time=ms||this.time||0;
this.data=[srt,srt,fin];
this.mS=this.time*(!scale?1:Math.abs((fin-srt)/(scale[1]-scale[0])));
this.c=typeof(c)=='string'?c.charAt(0).toLowerCase():this.c?this.c:'';
this.inc=Math.PI/(2*this.mS);
this.srttime=new Date().getTime();
this.cng();
},
cng:function(){
var oop=this,ms=new Date().getTime()-this.srttime,s=this.data[1],f=this.data[2],d=Math.floor(this.c=='s'?(f-s)*Math.sin(this.inc*ms)+s:this.c=='c'?f-(f-s)*Math.cos(this.inc*ms):(f-s)/this.mS*ms+s);
d=Math.max(d,s<0||f<0?d:0);
this.data[0]=d;
this.apply();
if (ms<this.mS){
this.to=setTimeout(function(){oop.cng(); },10);
}
else {
this.data[0]=this.data[2];
this.apply();
if (this.Complete) this.Complete(this);
}
},
apply:function(){
if (isFinite(this.data[0])){
if (this.mde!='opacity') this.obj.style[this.mde]=this.data[0]+'px';
else zxcOpacity(this.obj,this.data[0]);
}
}
}
function zxcOpacity(obj,opc){
obj.style.filter='alpha(opacity='+opc+')';
obj.style.opacity=obj.style.MozOpacity=obj.style.WebkitOpacity=obj.style.KhtmlOpacity=opc/100-.001;
}
</script>
BODY: Code: <script type="text/javascript">
/*<![CDATA[*/
function zxcFadeSlideShow(o){
var obj=document.getElementById(o.ID),imgs=obj.getElementsByTagName('IMG'),z0=0,ary=[],ms=o.FadeDuration,hold=o.Hold,srt=o.AutoStart,pag=document.getElementById(o.PaginateID),pary=[],z1=0;
for (;z0<imgs.length;z0++){
imgs[z0].style.position='absolute';
imgs[z0].style.zIndex=z0>0?'0':'2';
imgs[z0].style.left='0px';
imgs[z0].style.top='0px';
zxcOpacity(imgs[z0],z0>0?0:100);
ary[z0]=new zxcAnimate('opacity',imgs[z0],z0>0?0:100);
}
if (pag){
this.cls=['default','default active'];
for (;z1<ary.length;z1++){
pary[z1]=document.createElement('DIV');
pary[z1].className=this.cls[z1>0?0:1];
pag.appendChild(pary[z1]);
this.addevt(pary[z1],'mouseup','page',z1);
}
}
this.ary=ary;
this.pary=pary;
this.lstp=pary[0];
this.ms=typeof(ms)=='number'?ms:1000;
this.hold=(typeof(hold)=='number'?hold:1000)+this.ms;
this.srt=typeof(srt)=='number'?srt+this.ms:false;
this.to=null;
this.cnt=0;
this.lst=ary[this.cnt];
this.Auto(this.hold);
}
zxcFadeSlideShow.prototype={
Next:function(cnt,goto){
this.Pause();
if (this.lstp){
this.lstp.className=this.cls[0];
}
this.lst.obj.style.zIndex='0';
this.lst.animate(this.lst.data[0],0,this.ms,[0,100]);
this.lst=this.ary[cnt];
this.lst.obj.style.zIndex='2';
this.lst.animate(this.lst.data[0],100,this.ms,[0,100]);
if (this.pary[cnt]){
this.lstp=this.pary[cnt];
this.lstp.className=this.cls[1];
}
this.cnt=cnt;
if (goto&&this.srt){
var oop=this;
this.to=setTimeout(function(){ oop.auto(); },this.srt);
}
},
page:function(nu){
this.Next(nu,true);
},
addevt:function(o,t,f,p){
var oop=this;
if (o.addEventListener) o.addEventListener(t,function(e){ return oop[f](p);}, false);
else if (o.attachEvent) o.attachEvent('on'+t,function(e){ return oop[f](p); });
},
Auto:function(ms){
var oop=this;
this.to=setTimeout(function(){ oop.auto(); },ms||500);
},
Pause:function(){
clearTimeout(this.to);
},
auto:function(){
this.Pause();
var oop=this,cnt=this.cnt;
cnt=++cnt%this.ary.length;
this.to=setTimeout(function(){ oop.Next(cnt); oop.auto(); },this.hold);
}
}
S=new zxcFadeSlideShow({
ID:'tst', //(optional) unique ID name of the paent DIV. (string )
PaginateID:'paginate', //(optional) unique ID name of the paginate DIV. (string, default = no pagination)
FadeDuration:1000, //(optional) the fade duration in milli seconds. (number, default = 1000)
Hold:6000, //(optional) the 'hold' between auto rotation in milli seconds. (number, default = 1000)
AutoStart:2000 //(optional) auto start after goto. (number, default = no auto start)
});
x=new zxcAnimate('opacity',document.getElementById('tst'))
//x.animate(0,100,1000)
/*]]>*/
</script>
How do you make an image begin to load after a certain amount of time? e.g 3 seconds.
Hi I have some Javascript on my website http://www.restoreanddesign.co.uk The top bar has 4 images on a random cycle on load up/ refresh. Im trying to validate the xhtml, but it is coming up with errors. I dont understand javascript enough to be able to fix this. Anyone know what needs to be done to validate this javascript. i have bolded/coloured the lines i think is causing the problems -------------------------------------------------------------------- Code: <script type="text/javascript" language="JavaScript">
// JavaScript Document
var imagenumber = 4 ;
var randomnumber = Math.random() ;
var rand1 = Math.round( (imagenumber-1) * randomnumber) + 1 ;
images = new Array
images[1] = "images/newtopbar.jpg"
images[2] = "images/newtopbar2.jpg"
images[3] = "images/newtopbar3.jpg"
images[4] = "images/newtopbar4.jpg"
var image = images[rand1]
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
Hi. I am new here. I wanted help for a JavaScript code. You might think I'm lazy for not writing it myself, but the truth is I am not a JavaScript coder. I just have a really simple website and I am trying to do something for which I know JS is required but I don't know how to do it. I've also searched around but couldn't find the appropriate code. What I want to do is to make an html page load a different background image every time it refreshes. I will have a list of background images and I want to be able to add in this list, without having to change anything else in the codes after I do this (I think this is made by making an array of images and by putting .length somewhere in the codes, but I don't know exactly how I should do this). I already know how to do an external file (.js) and link to it from my .html page. Now I want the code to put in the .js file, and the code to put in the <body> of my .html file. Please help me Thanks Hey all, I'm trying to make it so that when a user clicks on a radio button, the image that is related to the radio button is displayed next to it (without reloading the page). At the moment all it shows is the image related to the currently saved option, which I'd like to keep on page load. Is this possible? If so, I'd appriciate any help. Here is my code for the radio buttons. Thanks. Code: <tr valign="top">
<td id="community-legal-services-logo-selection">
<p><label><?php _e('<strong class="table_tags">Display the following Community Legal Services logo:</strong>'); ?></p>
<p><label for="cls-mono">
<input class="" id="cls-mono" name="cls_logo" type="radio" value="cls_mono" <?php if($general_options['cls_logo'] === 'cls_mono'){ echo 'checked="checked"'; } ?> />
<?php _e('Mono'); ?></label>
</p>
<p><label for="cls-color">
<input class="" id="cls-color" name="cls_logo" type="radio" value="cls_color" <?php if($general_options['cls_logo'] === 'cls_color'){ echo 'checked="checked"'; } ?> />
<?php _e('Colour'); ?></label>
</p>
<p><label for="cls-none">
<input class="" id="cls-none" name="cls_logo" type="radio" value="cls_none" <?php if($general_options['cls_logo'] === 'cls_none'){ echo 'checked="checked"'; } ?> />
<?php _e('None'); ?></label>
</p>
<p>
<label><?php _e('<span class="table_tags">Link to the Community Legal Services website<span>'); ?></label>
</p>
<p>
<input class="large_input_box" id="cls-link" name="cls_link" type="text" value="<?php echo $general_options['cls_link']; ?>" /></label>
</p>
</td>
<?php if($general_options['cls_logo'] && $general_options['cls_logo'] !== 'cls_none'){ ?>
<td>
<img id="community-legal-services-logo-preview" class="image-preview" src="<?php echo $general_options['cls_logo_path']?>" />
</td>
<?php } ?>
</tr>
I tried posting this same thread under AJAX and I didn't get a single response. I am wondering if it may be in the wrong section so I decided to try here. If this is bad posting etiquette, I apologize. Hello. I am trying to use a form to submit values to MySQL and then have a Google map returned that has certain parameters. I have modeled this code after an example I found on w3schools. I believe that this is strictly a javascript coding problem. This is the code that I am using: Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Page Language="C#" %>
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#filter {
height: 5%;
width: 73%;
margin-top: 5px;
margin-left: 2%;
border: 3px solid black;
padding: 1%;
overflow: auto }
#txtHint {
height: 20%;
width: 73%;
margin-top: 5px;
margin-left: 2%;
border: 3px solid black;
padding: 1%;
overflow: auto
}
#maplist {
height: 60%;
width: 75%;
margin-top: 5px;
margin-left: 2%;
border: 3px solid black }
</style>
<script type="text/javascript">
function showTrail(str)
{
if (str=="")
{
document.getElementById("maplist").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)
{
alert(xmlhttp.responseText);
}
}
xmlhttp.open("GET","traillist2.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<div id="filter">
<form name="filterform">
<select id="scenery" onchange="">
<option value="">Select Scenery Rating:</option>
<option value="a">A</option>
<option value="b">B</option>
<option value="c">C</option>
<option value="d">D</option>
<option value="f">F</option>
</select>
<select id="length" onchange="">
<option value="">Select Trail Length</option>
<option value="g">Less than 1</option>
<option value="h">1-2.9</option>
<option value="i">3-4.9</option>
<option value="j">5-6.9</option>
<option value="k">7-8.9</option>
<option value="l">More than 9</option>
</select>
<select id="difficulty" onchange="">
<option value="">Select Trail Difficulty</option>
<option value="m">Easy</option>
<option value="n">Moderate</option>
<option value="o">Strenuous</option>
</select>
<input id="combined" type="button" value=" Find Trail!
"onclick="showTrail(this.form['scenery'].value +
this.form['length'].value + this.form['difficulty'].value)"/>
</form>
</div>
<div id="maplist"></div>
</body>
</html>
The code is designed to drop the map into the "maplist" div. In the code above, you see that I have the line "alert(xmlhttp.responseText);" which was originally: document.getElementById("txtHint").innerHTML=xmlhttp.responseText;" I wrote the php page so it would return code as shown below. This is the actual responseText received from the alert. Code: script type="text/javascript">
var map;
function initialize() {
var latlng = new google.maps.LatLng(34.65, -83.9);
var options = {
zoom: 9,
center: latlng,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
var infoWindow = new google.maps.InfoWindow;
var html;
var map = new google.maps.Map(document.getElementById('map_canvas'),
options);
var point = new google.maps.LatLng(
parseFloat(34.558350),
parseFloat(-84.250122));
var marker = new google.maps.Marker({
position : point,
map : map,
icon : 'http://labs.google.com/ridefinder/images/mm_20_red.png'
});
var html = '<div><br><b>Amicalola Falls State Park - Creek Trail</
b><br><br><b>Trail Length: </b>0.5 miles<br><b>Scenery
Rating: </b>C<br><b>Difficulty Rating: </
b>Easy<br><b>Trail Features: </b>Stream<br><br><font
size:large><font face="Tahoma, Geneva, sans-serif" size="1"
color="#000071"><strong><a href="http://www.digitaltrailguide.com/
amicalolafallsstateparkcreekmountainlaurelspringtrails.aspx">View This
Trail</a></strong></font></div>';
bindInfoWindow(marker, map, infoWindow, html);
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
}
function loadScript() {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://maps.google.com/maps/api/js?
sensor=false&callback=initialize";
document.body.appendChild(script);
}
window.onload = loadScript;
</script>I thought that this code would be dropped into the div and
Hi there, Im looking for a general function which would work for most browsers when using the xmlhttprequest() I am just trying to send input data to the server store it and send back a response. I have one that works for both ie and ff, however when using ff the function does not return the text from the request to the server, but does with ie no problems. Any help would be much appreciated. Thanks Code: /* get response http request */
function getData(cURL) {
var xmlHttp = null;
xmlHttp = new XMLHttpRequest();
/* branch logic for ff or ie */
if (navigator.appName=='Netscape')
lSynch = true;
else
lSynch = false;
xmlHttp.open( "POST", cURL, lSynch );
xmlHttp.send( null );
var info = xmlHttp.responseText;
return info;
}
Ok, so I have built a website using galleryCMS, a pre-built CMS for images, which outputs XML via php to an address of: http://www.granitesupermarket.ca/login.php/view/xml Firefox and Chrome can pull the XML from the webpage using my code, however IE does nothing with it at all. I have found that if I use a page with a proper xml extension then the code works fine (ie test.xml); however, without the .xml it seems like IE does nothing?? I am not the most advanced user, so tampering with the CMS is not the best option for me... is there any workaround that I might be able to employ? Maybe a way I could take the xml I get from "login.php/view/xml" and save it to gallery.xml on the same server? Any help or ideas would be helpful. Code: <html>
<head>
<title></title>
<head>
<body>
<script type="text/javascript">
// Get XML function
function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send();
return xhttp.responseXML;
}
// XML source
xmlDoc=loadXMLDoc("login.php/view/xml")
t=xmlDoc.getElementsByTagName("thumbnail");
// TEST THAT XML IS WORKING
document.write(""+ t[0].childNodes[0].nodeValue + "");
</script>
</body>
</html>
|
|||||||