Learn VBA & Macros in 1 Week!

JavaScript - Ie Compatibility Issue

Full Excel VBA Course - Beginner to Expert

Ie Compatibility Issue	View Content

EDIT: i think the problem was i had an html element named 'comment' so IE was getting confused when i made a js variable 'comment'
(don't use IE it is the worst browser)

i am in the process of debugging a website, it works wel in Google Chrome and firefox but not in IE
i am putting all the relevant code below.
this is in the head tag, and is the only JavaScript executed when the debugger show the error
Code:

function first_run(){
answer_state=document.getElementById('state');//set node for 'show_answer' function
answer_ab=document.getElementById('ab');//set node for 'show_answer' function
answer_capitol=document.getElementById('capitol');//set node for 'show_answer' function
answer_next=document.getElementById('next');
comment=document.getElementById('comment')//line marked with error
ui=document.getElementById('UI');//sets 'ui' to form location
score_right=document.getElementById('right');//returns null
score_wrong=document.getElementById('wrong');
score_right=score_wrong.previousElementSibling//score_right work around
score_show_ans=document.getElementById('show_ans');

runs above code on page load
Code:

<body onkeydown="if (event.keyCode == 13){check()}" onload="first_run()">

in body tag, node that erred line refers to.
Code:

<div id=comment>
</div>

the error message in IE's developer tools debugger is "Object doesn't support this property or method" States javascript.html, line 395 character 1"

i've done all of my coding in Chrome and have no expirence in IE's syntax, any ideas what the problem is?

Full Excel VBA Course - Beginner to Expert

Browser Compatibility Issue

Similar Tutorials

View Content

Hi i have a php file that contain below content and it works great on firefox but not in IE8

actually IE8 doesnt reload the div

Code:

<?php
print <<<HERE
<script type="text/javascript">
$(document).ready(function() {
$("#loader").load("content.php?uname=$uname");
var refreshId = setInterval(function() {
$("#loader").load("content.php?uname=$uname");
}, 5000);
});
</script>
HERE;
?>

<div id="loader"></div>

also i tried like this and same thing happens

Code:

<?php
print <<<HERE
<script type="text/javascript">

setInterval("calldiv()", 5000);
function calldiv(){
$("#loader").load("content.php?uname=$uname");
}

</script>
HERE;
?>
<div id="loader"></div>

any help would be great

Thanks.

Safari Compatibility Issue With Dynamic Population Of Selects

Similar Tutorials

View Content

Anyone have any issues with Safari in relation to javascript compatibility?

I have a page that loads dynamically through user selections as follows:

There is a set of three radio buttons. The user selects one and a div opens revealing a select box populated with entries related to the radio button selection.

When the user makes a selection from the select box, one of two things happen. 1) If there are child records relating to their selection, a second div opens revealing another select box containing the child entries relating to the first select box choice. Or 2) if there are no child entries relating to the selection in the first select box, a div opens displaying a description relating to the selection they made in the first select box.

The data is all coming from prepopulated javascript arrays.

This works like a dream in IE and Chrome. Unfortunately, when we were in the final stages of testing before release to a live environment, we discovered it works in Safari only as far as the user makes a selection from the three radio buttons driving the opening of the first div layer containing the first select. At this point it stops working completely.

On top of that, I can not find where in the latest release of Safari, that I can see any javascript errors (or if I even can). I am REALLY in need of help. Anything you can offer?

Thanks!!

Dmxsmith

Js/iframe Compatibility In Ie8?

Similar Tutorials

View Content

Hi--

I have the following javascript which is setting up a quiz (delivered from off-site) into an iframe. The javascript code determines if the visitor has Flash or not, and then sets up the page, on button click, to deliver the appropriate version of the quiz into the iframe.

For some reason, this code works in everything (it seems) except IE8. In IE8 without Flash, something (perhaps in the code itself?) kicks the viewer into a blank page. If someone could just test the URL below and tell me if they get the same problem, that would help! Maybe (I am thinking) it is because the computer I tested it on did not have JS enabled? Or maybe there is something in the code? Or maybe with the quiz delivered from off-site?

Here is the code:
Quote:


<article id="page_7c">
<div class="box" id="page1">
<a href="#page_1" class="close"></a>
<div class="wrapper pad_bot1">
<div class="grid_16 prefix_4">

<p></p>
<div id="tester">

</div>

</div>
</div>
</div>
</article>


<SCRIPT>

</SCRIPT>
And here is the URL of the site:

Quote:
http://www.ABCsofUFOs.com
If you click on the link bottom left ("Test Your Knowledge of UFOs") that should send you to the appropriate version of the quiz.

Many thanks for any help!

Compatibility Problems With Ff.

Similar Tutorials

View Content

Hi, I have a piece of code that when executed will change the .onclick and .value of a button,

Code:

/* JAVASCRIPT */

function selectAllDays() {  
	var len = document.booking.days.length;
	for (var i=0; i<len; i++) {
		document.booking.days[i].checked = true;		
	}
	changeDaysButtonD();  
}

function deselectAllDays() { 
	var len = document.booking.days.length;
	for (var i=0; i<len; i++) {
		document.booking.days[i].checked = false;		
	}	
	changeDaysButtonS();  
}

function changeDaysButtonD() {   
	var obj = document.getElementById('selectall');
    obj.onclick = deselectAllDays;
	obj.value = "Deselect All Days";
}

function changeDaysButtonS() { 
	var obj = document.getElementById('selectall');
    obj.onclick = selectAllDays;
	obj.value = "Select All Days";
}

Code:

HTML

<input type="button" id="selectall" name="selectall" value="Select All Days" onclick = "selectAllDays();"><br/>
<input type="checkbox" name="days" value="Monday">Monday<br/>
<input type="checkbox" name="days" value="Tuesday">Tuesday<br/>
<input type="checkbox" name="days" value="Wednesday">Wednesday<br/>
<input type="checkbox" name="days" value="Thursday">Thursday<br/>
<input type="checkbox" name="days" value="Friday">Friday<br/>

So, when the button is initially clicked it runs the selectAllDays() function, which will also run the function to change the state of the button to "Deselect all days" however when I run this in FireFox it gives the error of
Error: selectAllDays is not defined
Source File: http://davidc.herobo.com/groupsite/booking.html

Though in Internet Explorer this runs fine and selects/deselects the checkboxes without any problem.

I'd like to know if anyone knows why it won't work in FireFox?

Help would be much appreciated,
Thanks, Dave.

Mac & Pc Compatibility For Javascript....

Similar Tutorials

View Content

Hi, I am not very experienced in programming, but I've noticed I keep running into a problem. I've got a particular javascript coding and for some reason it is only working for my mac visitors, but not PC.

What can I do to make this coding compatible for both? Where might the issues be?

thanks

Ie8 Compatibility Javascript Code

Similar Tutorials

View Content

Hi,
I have an application in which a popup window is opened from main window, from that popup window on clicking a button, the control goes to a servlet and after some calculations the control returns to the popup window. This works fine in IE6. But the same code behaves improperly in IE8. In IE8 on clicking button on popup window instead of control coming back to same popup window a new popup is opened. Can anybody help me on this?

Javascript Compatibility Problem

Similar Tutorials

View Content

Hello, so i got one question. I have this Java Script of old facebook chat which works great at chrome and firefox with greasemonkey but when i tried to put this at IE9 with IEPro plugin , facebook just went crazy. Cant open chat at all, also all site is broken. What is problem with this script at IE,Safari or Opera?
Maybe you can help me thx.

You can find that script here : www.fu.sk/107159.user.js

Browser Compatibility And Javascript

Similar Tutorials

View Content

Dear all, can somebody help me with browser compatibility and this code. Working fine in Opera and Firefox, but do not working in Internet Explorer and Chrome. With one form working fine in every browser, but when I put second form it stops to work in Explorer and Chrome.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<META http-equiv=Content-Type content="text/html; charset=UTF-8">
<SCRIPT type="text/javascript">
function showDiv(divIndex) {  var f=document.forms[0];  var d=f.getElementsByTagName('div');
for(i=0;i<d.length;i++)d[i].style.display='none'
d[divIndex].style.display = 'block';
}
</SCRIPT>
</HEAD>
<BODY>
<form>
<select onchange="showDiv(this.value); ">
<option value="0" selected>option 1</option>
<option value="1">option 2</option>
<option value="2">option 3</option>
</select>


<div style="display:block;"><form action="001.htm" method="get" >
Your state<br> 
<select name="statecode" id="statecode">
<option value="">Choose State for option 1...</option>
<option value="AK">Alaska</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
</select> 
<input type="submit" name="search" value="Get Quotes" />
</form></div>

<div style="display:none;"><form action="002.htm" method="get" >
Your state<br> 
<select name="statecode" id="statecode">
<option value="">Choose State for option 2...</option>
<option value="AK">California</option>
<option value="AL">Colorado</option>
<option value="AR">Connecticut</option>
</select> 
<input type="submit" name="search" value="Get Quotes" />
</form></div>

<div style="display:none;"><form action="003.htm" method="get" >
Your state<br> 
<select name="statecode" id="statecode">
<option value="">Choose State for option 3...</option>
<option value="AK">Massachusetts</option>
<option value="AL">Maryland</option>
<option value="AR">Maine</option>
</select> 
<input type="submit" name="search" value="Get Quotes" />
</form></div>

</form>
</BODY></HTML>

Layer Questions About Compatibility

Similar Tutorials

View Content

Hello

I have this var set:

var floatingMenu =
{
targetX: -270 ,
targetY: 13,

hasInner: typeof(window.innerWidth) == 'number',
hasElement: document.documentElement
&& document.documentElement.clientWidth,

menu:
document.getElementById
? document.getElementById(floatingMenuId)
: document.all
? document.all[floatingMenuId]
: document.layers[floatingMenuId]
};

I want the number to be assigned to targetX (the red part) to be different for Firefox, Chrome or Internet Explorer. How do i do that?

Also, can i avoid this IE's warning about running active x content? Come on... This is a javascript for making a floating menu, there's no security issue whatsoever!

Settimeout And Elemid Compatibility Problem

Similar Tutorials

View Content

Hello all.

I am doing an experiment with setTimeout for a much larger project and cant seem to get this bit of code working. What is "supposed" to happen is on hover the div goes black, and on removing the mouse it turns red after 1 second. however, it doesnt work. ive tried a bunch of variations but nothing gets it to work. i want to line up a bunch of divs and not need to write a seperate function for each one. any ideas?

here is the HTML:

Code:

<div id="0" onMouseOver="blackit('0')" onMouseOut="fadeit('0')"></div>
<div id="1" onMouseOver="blackit('1')" onMouseOut="fadeit('1')"></div>
<div id="2" onMouseOver="blackit('2')" onMouseOut="fadeit('2')"></div>
<div id="3" onMouseOver="blackit('3')" onMouseOut="fadeit('3')"></div>

here is the JavaScript:
Code:

function blackit(elemID)
{
document.getElementById(elemID).style.backgroundColor="#000";
}

function fadeit(elemID)
{
setTimeout("document.getElementById(elemID).style.backgroundColor='red'", 1000);
}

there is some CSS but nothing crazy. it should work but it doesnt. the black on hover works but then it either stays black or goes red immediately, not waiting the 1 second.

thanks

Noob Javascript Ie Compatibility Problem

Similar Tutorials

View Content

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

Newbie Stuck On Compatibility Problem

Similar Tutorials

View Content

I adapted (well, attempted to, at least) a quote/testimonial rotation script to fit into my website. The script works PERFECTLY on Firefox but after making my modifications, I killed it in IE...and being a total n00b to JavaScripting.....I'm totally stumped.

In Firefox, the script shows at the proper height. In Internet Explorer, the script is only shown at ~40 pixels and doesn't seem to be rotating through the different quotes (it still fades but it fades the same quote back and forth).

The obvious question: HOW DO I FIX IT?!!?

Original script was found at: http://www.caodesigns.com/blog/tutor....php?postID=33

My script is at: http://www.digitalctrl.org/help.html (right sidebar, in the "Testimonials" box).

But something I want to know for future reference.......what is it that causes things to be formatted differently across browsers? This cross browser INcompatability is giving me grey hairs.

I've been lurking around your community for a while now.....I hope you gents don't mind my first post being a question.

If I need to reformat my post or do anything else to get assistance, please let me know so I can take care of it.

Firefox, Opera, Safari, Netscape Compatibility

Similar Tutorials

View Content

<BODY onLoad="populateYearSelect()">
<font face="Verdana">
<title>owner Calendar</title>
</font>



function populateYearSelect()
{
d = new Date();

curr_month = d.getMonth();

document.getElementById('arrivemonth').options[curr_month + 1].selected=true;

curr_year = d.getFullYear();

for(i = 0; i <= 3; i++)
{
document.getElementById('arriveyear').options[i] = new Option(curr_year+i,curr_year+i);
}

}
</script>

This is the function I am using and it works great in IE but all other browsers are not even loading the function at all. What must i do to make this work in other browsers? I need them to work more so in Firefox and Safari more so than Opera, Avant or Netscape.

Onmouseout On Div Tag--bubbling Problems, Cross Browser Compatibility?

Similar Tutorials

View Content

Hi all, I am having trouble with an onmouseout event on a div tag. I have read about bubbling a little, and put to use some information I found on the internet, but I still can't overcome a few problems.

What I am trying to achieve is that the addStyleDiv function will only call the addStyle function if the user mouses out of the 'rollover' div. As the code stands, the addStyleDiv function is called when any element within the div is moused out (this is expected--bubbling) and the addStyleDiv function handles these instances properly. However, when mousing out of the rollover div, the rollover div is never the source element that triggers the onmouseout event. There is no empty space in the rollover div, that is, it is entirely filled with elements, so that could be part of the problem, but shouldn't bubbling cause the event to be triggered twice-once for the internal element and once for the div itself?

I would also be interested in knowing if the method by which I am handling the events is reliable on most browsers or if someone with more expertise can offer a suggestion to increase cross browser compatibility.

Thanks a million in advance.

HTML
Code:

<div id="rollover" onmouseout="addStyleDiv(event,'feat_main');">
<ul id="featured">  
<li class="medical" onmouseover="addStyle('feat_medical');"><a href="equipment/medical">Medical</a></li>
<li class="fabrication" onmouseover="addStyle('feat_fabrication');"><a href="services/metal_fabrication">Fabrication</a></li>
<li class="capsnap" onmouseover="addStyle('feat_capsnap');"><a href="equipment/capsnap">CapSnap&trade;</a></li>
<li class="hurricane" onmouseover="addStyle('feat_hurricane');"><a  href="equipment/parts_washing/hurricane">Hurricane</a></li>
<li class="media" onmouseover="addStyle('feat_media');"><a href="video">Media</a></li>
</ul>
<div id="flyout" >
    <ul id="feat_main">
        <h1>Midbrook</h1>
        standard page no rollover
    </ul>
    <ul id = feat_medical>
        <h1>Medical</h1> 
    </ul>
    <ul id = feat_fabrication>
        <h1>Fabrication</h1>
    </ul> 
    <ul id = feat_capsnap>
        <h1>CapSnap</h1>
    </ul>
    <ul id="feat_hurricane">
        <h1>Hurricane</h1>
    </ul>
    <ul id = feat_media>
        <h1>Media</h1>
    </ul>   
</div>
</div>

JS
Code:

function addStyleDiv(e, x)
{
   if (!e) var e = window.event;
   var tg=(window.event) ? e.srcelement : e.target;
 
 if (tg.id != 'rollover') 
 {
     alert('leaving '+tg.tagName + ' '+tg.id);
     return;
 }
   /*These next two lines are NEVER reached no matter what*/
   alert('It must have finally seen rollover');
   addStyle('feat_main');
}
 
function addStyle(x){
 removeAllStyle();
 document.getElementById(x).style.display="block";
}
function removeAllStyle()
 {
     removeStyle('feat_main');
     removeStyle('feat_hurricane');
     removeStyle('feat_fabrication');
     removeStyle('feat_capsnap');
     removeStyle('feat_medical');
     removeStyle('feat_media');
 }

Review This "show/hide Layers" Script For Errors And Cross Browser Compatibility

Similar Tutorials

View Content

I found this script on a tutorial site but it had no summary of browser compatibility or any other issues. I know absolutely nothing about javascript and, although it works fine when I test it, I would appreciate it very much if someone else would review this page and give me feedback.

Code:

<head>
<script type="text/javascript">
lastone='empty'; 
function showIt(lyr) 
{ 
if (lastone!='empty') lastone.style.display='none'; 
lastone=document.getElementById(lyr); 
lastone.style.display='block';
}
</script>
</head>
<body>
<!--links-->
<a href="JavaScript:;" onClick="showIt('divID1')" ">link1</a>
<a href="JavaScript:;" onClick="showIt('divID2')" ">link2</a>
<a href="JavaScript:;" onClick="showIt('divID3')" ">link3</a>
<a href="JavaScript:;" onClick="showIt('divID4')" ">link4</a>
<!--layers-->
<div id="divID1" style="display:none;">content1</div>
<div id="divID2" style="display:none;">.content2</div>
<div id="divID3" style="display:none;">..content3</div>
<div id="divID4" style="display:none;">...content4</div>
</body>

Here is a demo of it in action:
http://www.mousegrey.com/layers.html

Issue In Ie

Similar Tutorials

View Content

Freaking IE. Must die. Really it must.

Unfortunately, I have to code for it, and I can't figure out what went wrong he

http://wyqued-design.com/dev/skyview/index.html

The navigation, and layout, breaks in IE 7. Any ideas?

-Emilie

Nan Issue

Similar Tutorials

View Content

I have the following sample html file (attached). I am trying to display the calculated field using javascript and I created a function (I am a newbie) to do so. However, it persistently shows NaN instead of the required number. I have tried my best over a coupla hours racking my brains and the internet as to why it shows as not a number.
I will appreciate any help.
Thanks,

Hi All.. Javascript Issue.. Pl Help

Similar Tutorials

View Content

Hi
I am trying to build an application which has 6 small input fields and one numeric key pad. Initially the focus should be on the first inputfield and after entering the number from the numeric key pad, it should shift the focus to third input field and the user should be able to enter the number from the numeric key pad and then shift the focus to fifth input field and user should be able to enter the number in fifth through the key pad.

I have achieved till gaining the focus on the first input field and i could enter the number through the key pad and i was able to shift the focus to third input field but however whatever i enter the number is getting changed in first and third input field. the code i wrote is below

Code:

<html>

<head>
<script type="text/javascript">
function displaymessage(val)
{
document.getElementById('first').value = val;
alert(document.getElementById('first').value);
if(document.getElementById('first').value!=null)
{
alert("yes");

document.getElementById('third').focus();
document.getElementById('third').value = val;
}

}
</script>
</head>

<body onload="document.getElementById('first').focus();">
Enter your pin: 
<input type="text" id="first"   size="1" maxlength="1"></> &nbsp; 
<input type="text" id="second"  size="1" maxlength="1" /> &nbsp; 
<input type="text" id="third"  size="1" maxlength="1" /> &nbsp; 
<input type="text" id="fourth"  size="1" maxlength="1" /> &nbsp;
<input type="text" id="five"    size="1" maxlength="1" /> &nbsp; 
<input type="text" name="six"   size="1" maxlength="1" />

<table border="1">
<tr>
<td width="30px" align="center"><input type="button" value="1" onclick="displaymessage(1)"/> </td>
<td width="30px" align="center"><input type="button" value="2" onclick="displaymessage(2)"/> </td>
<td width="30px" align="center"><input type="button" value="3" onclick="displaymessage(3)"/> </td>
</tr>
<tr>
<td width="30px" align="center"><input type="button" value="4" onclick="displaymessage(4)"/> </td>
<td width="30px" align="center"><input type="button" value="5" onclick="displaymessage(5)"/> </td>
<td width="30px" align="center"><input type="button" value="6" onclick="displaymessage(6)"/> </td>
</tr>
<tr>
<td width="30px" align="center"><input type="button" value="7" onclick="displaymessage(7)"/> </td>
<td width="30px" align="center"><input type="button" value="8" onclick="displaymessage(8)"/> </td>
<td width="30px" align="center"><input type="button" value="9" onclick="displaymessage(9)"/> </td>
</tr>
</tr>
<tr>
<td width="30px" align="center"><input type="button" value="0" onclick="displaymessage(0)"/> </td>
<td width="30px" align="center"><input type="button" value="Reset"/> </td>
</tr>
</table> 
</body>

</html>

I know thats because I am filling the val variable again in the third input field and that is the reason it is getting changed in first and third. However I am not aware of what other best methods we could use on this.

Pleasee helpp..

Recursion Issue

Similar Tutorials

View Content

Hey im having a problem recursively calling my function. What I want to do is to change MyImages[0-14] with a timeout between them. Here is my code.

Code:

function swapImage(i) {
	 if(i < 15)
	 {
		MyImages[i].src = "red_dot.gif";
		setTimeout("swapImage(i+1)",500);
	}
}

The problem is that it will only change MyImages[0] and MyImages[1]

Encoding Issue

Similar Tutorials

View Content

This issue is right at the cross point between the java and javascript. Basically, I want to DYNAMICALLY pass some Cyrillic characters (such as Алла Пугачева) at the runtime to the javascript function, as following:

Current text encoding setting is Cp1252 in JAVA IDE.

response.getOutputStream().println("<script>test('" + testCoding +"');</script>");

If the testCoding is normal latin chracter (such as "abc, xyz"), this will work, so that at the runtime, it will execute the funciton test(param) and passing the parameter, "abc, xyz" to the javascript function test(param).

The frontend javascript function test(param) will further display it as: field.innerHTML = param;

But if it is the Cyrillic characters (such as Алла Пугачева), it won't work.

The "Алла Пугачева" will be passed as the garbage character and displayed as so.

How can I in the java class DYNAMICALLY set up the encoding so that the sysytem at the runtime will acccept the Cyrillic characters. I would believe I need to setup such ancoding as UTF-8. But I do not know how to? OR,

How can I process the Cyrillic characters (such as Алла Пугачева), in the javascript function so that it can be displayed properly?

Thanks

Scott