General Question

ETpro's avatar

What's bugging my simple JavaScript toggle script?

Asked by ETpro (34202 points ) December 8th, 2013

It’s posted at http://www.mikamaya.com/text-toggle.html. View source and you will see it is a very simple script intended to toggle the visibility of a default DIV with dimensions in English to an alternate DIV with dimensions in Metric. For some reason, it doesn’t want to toggle. It’s stuck on English. Anyone see a fix?

Observing members: 0 Composing members: 0

3 Answers

CWOTUS's avatar

The “toggle_visibility” function specifies (eng, met), not (var1, var2), so it seems not to matter what order of parameters you send it, it’s going to read (eng, met) always.

function toggle_visibility(eng, met) {
var e1 = document.getElementById(eng);
var e2 = document.getElementById(met);
if(e1.style.display == ‘block’) {
e1.style.display = ‘none’;
e2.style.display = ‘block’;
} else {
e1.style.display = ‘block’;
e2.style.display = ‘none’;
}

jaytkay's avatar

You actually don’t have to pass div objects to toggle_visibility.

The script below works for me.

1) I put quotes around the getElementById arguments “eng” and “met”
2) I removed arguments from toggle_visibility and its call

function toggle_visibility()
{
var e1 = document.getElementById(“eng”);
var e2 = document.getElementById(“met”);
if(e1.style.display == ‘block’)
{
e1.style.display = ‘none’;
e2.style.display = ‘block’;
}
else
{
e1.style.display = ‘block’;
e2.style.display = ‘none’;
}
}

<div id=“eng” style=“display: block;”>
This is English<br />
<a href=”#” onclick=“toggle_visibility();”>Convert to Metric</a>
</div>
<div id=“met” style=“display: none;”>
This is Metric<br />
<a href=”#” onclick=“toggle_visibility();”>Convert to English</a>
</div>

ETpro's avatar

@jaytkay That does it. Works like a charm. Thanks.

@CWOTUS That’s the scripting solution to what you were pointing out. Thanks.

Answer this question

Login

or

Join

to answer.

This question is in the General Section. Responses must be helpful and on-topic.

Your answer will be saved while you login or join.

Have a question? Ask Fluther!

What do you know more about?
or
Knowledge Networking @ Fluther