IE7 returning 'toJSON' instead of 'i' value

[homeautomation]

Hi all,

I'm not overly proficient at Javascript, but have fumbled my way through some tutorials to come up with the following code to create a tab mechanism.

It works perfectly in Firefox, Safari, Chrome and IE8. However, in IE6 and IE7 it fails to operate as of the 'for (var i in temp) {' line. It doesn't error out, it just doesn't perform any of the functions within the for.

Some things I've noted:
* In Firefox if I alert(i) below the for, then it alerts the numerical value of i correctly through the for loop.
* In IE7, however, alert(i) alerts the value 'toJSON' and nothing more. It never finds 'if (i <= maxlen) {' to be true as a result.

Any thoughts on what's going wrong here?

function toggle_visibility(showid, hideids) {
	$(showid).style.display = 'block';
	// Change CSS
	var newcss = showid.split('_').join('');
	$(newcss).setAttribute("class", "tabselected"); 
	$(newcss).setAttribute("className", "tabselected");
 
	if (hideids != '') {
		var temp = new Array();
		temp = hideids.split(',');
		var maxlen = (temp.length - 1);
		var i = 0;
		for (var i in temp) {
			if (i <= maxlen) {
				if (temp[i] != showid) {
					$(temp[i]).style.display = 'none';
 
					var newcss = temp[i].split('_').join('');
					$(newcss).setAttribute("class", "tab2"); 
					$(newcss).setAttribute("className", "tab2");
				}
			} else {
				break;
			}
		}
	}
}

And I'm calling it with

toggle_visibility('tab3', 'tab1,tab2');

[crmalibu]

http://www.prototypejs.org/api/array

[paul_wilkins]

The for...in construct is designed for objects, not arrays.

You would be better placed to use a more standard for loop.

var i;
for (i = 0; i < temp.length; i += 1) {
    ...
}

Then debugging can proceed along to working out what's causing the issue.

[paul_wilkins]

By the way, which script library are you using? I know that from the way the $ sign is used that it can't be jQuery.

I can let you know that an equivalent form of code that might work with jQuery is as follows:

function toggle_visibility(showid, hideids) {
    $('#' + showid).show();
    $(showid.split('_').join(''))
		.removeClass('tab2')
		.addClass('tabselected'); 
    jQuery.each(hideids.split(','), function () {
		if (this != showid) {
			$('#' + this).hide();
			$(this.split('_').join(''))
				.removeClass('tabselected')
				.addClass('tab2');
		}
    });
}

[homeautomation]

Thank you for your help chaps, I've implemented the new for and it all seems to be working. I'll test it some more across some different browsers and O/Ss, but it did seem to be as simple as that (Where's the head smacking smiley?)