PDA

View Full Version : Drop list show/hide not working in IE?



BLiZZaRD
01-12-2008, 12:18 PM
Okay, I will be the first to admit I don't know much about JS. But I have a fairly nice "FAQs" page on my site written in JS.

The effect is you go to the page and there is a drop down list of 14 or so "questions" from which you can select. You choose a question and the "answer" magically appears below the drop down box in it's own little div.

When I first put it up I thought, hey this is cool, and it works. And it stayed that way for months. All of a sudden I am getting complaints about that page.

Come to find out it is only working in Fx. IE6, IE7, Safari (haven't tested opera) show the drop down box, let you choose a question but never display the answer.

I can't for the life of me figure out why?

Any help?

The page is found here (http://cleverwasteoftime.com/faqsoriginal.html) and all items are in the source code. I would really like to get this working again ASAP. :rolleyes:

pman
01-12-2008, 05:03 PM
Appearantly IE(don't know about IE7) doesn't allow events on "option" element. You have to use "onchange" event in this case on your "select" element. I know it's painful.

Here's a link that talks about it

http://www.lattimore.id.au/2005/07/01/select-option-disabled-and-the-javascript-solution/

You can find more. Just google for events on "option" element

BLiZZaRD
01-12-2008, 05:50 PM
I'm sorry, I don't speak Greek.... :(

Twey
01-12-2008, 06:24 PM
Wha'? o.@

BLiZZaRD
01-12-2008, 07:01 PM
Reading instructions in JS is like reading Charlie Brown's Teachers' lips...

Master_script_maker
01-12-2008, 07:53 PM
<script type="text/javascript">
function showMe(selectMe) {
document.getElementById("Q1").style.display = "none";
document.getElementById("Q2").style.display = "none";
document.getElementById("Q3").style.display = "none";
document.getElementById("Q4").style.display = "none";
document.getElementById("Q5").style.display = "none";
document.getElementById("Q6").style.display = "none";
document.getElementById("Q7").style.display = "none";
document.getElementById("Q8").style.display = "none";
document.getElementById("Q9").style.display = "none";
document.getElementById("Q10").style.display = "none";
document.getElementById("Q11").style.display = "none";
document.getElementById("Q12").style.display = "none";
document.getElementById("Q13").style.display = "none";
document.getElementById("Q14").style.display = "none";
if (selectMe != "selection") {
document.getElementById(selectMe).style.display = "block";
}
}

</script>

<br><br>
<select onChange="showMe(this.value)" name="menu" style='border: solid 1px #00CCCC; background-color: #CCCCCC; width: 85%; text-align: left; padding: 2px;'>
<option value="selection">Select Question...</option>
<option value="Q1">1) How do I look at the source code?</option>
<option value="Q2">2) What are egg pages?</option>
<option value="Q3">3) Will I need Photo Shop to complete this game?</option>
<option value="Q4">4) How come, when I convert a file to the format it says I need, I still can't find the clues I am supposed to find?</option>
<option value="Q5">5) I found a code, but I don't know how to decode it. Will someone tell me what it says so I can move on?</option>
<option value="Q6">6) I don't know how to use [some program name]. Can someone tell me what I need to do?</option>

<option value="Q7">7) I am not running a "required system" and I don't know how to find summary information on a file. Can someone just give me the answer?</option>
<option value="Q8">8) Why are the hints in the threads so obscure?</option>
<option value="Q9">9) Some of my forum posts now say "spoiler edit" in the place of some of my words. Am I in trouble for posting spoilers without meaning to?</option>
<option value="Q10">10) I noticed my posts have disappeared and my post count has gone down. Why did my previous posts disappear?</option>
<option value="Q11">11) CWoT is awesome! Can I be a Moderator too?</option>
<option value="Q12">12) While searching the internet with the clues I found I came across a site that had the spoilers in it.What can be done?</option>
<option value="Q13">13) Am I allowed to post links to other games in the CWoT forum?
<option value="Q14">14) When I make a post or send a PM, Bubba Loves Me shows up in place of some of my words. Why?</option>
</select>
</p>

BLiZZaRD
01-12-2008, 08:02 PM
Ohh, I see what you did... So that's what they meant by hard coding the function? Interesting...

I will give it a try! Thanks!


That did the trick. Muchas Gracias!

Twey
01-12-2008, 08:32 PM
Ow.
function showMe(selectMe) {
for(var i = 1; i < 15; ++i)
document.getElementById("Q" + i).style.display = "none";

if (selectMe != "selection")
document.getElementById(selectMe).style.display = "block";
}No comments on whether this code is actually correct or not, just removing the redundancy.