java script: "if-block doesn't work in IE lower than Edge"

Question

I want to use a very small piece of Java-script to show or not to Show one field with options depending on if one or the other checkbox is checked. It works on every browser, but not in the IE-Browsers lower than Edge. Can this be a problem with the ".checked"-method" or do I have to use another Syntax in older IEs for the "if-else-loop?"

Thank you, for the quick answers! to be more exact: I don't need to develop for IE<9. When I use ".getElementsByClassName" outside the if-statement the code works on IE9 to 11. The Problem must be something with the else-if or with the .checked-method. I tried some other syntax-variants, but I didn`t get it to work. Some Ideas for a correct syntax like ".checked == true" or so?

function oneortwo() {
    if(document.getElementById("opt_18_0").checked) {
        document.getElementsByClassName("fieldset_file2")[0].style.display = "none";              
    } else {
        document.getElementsByClassName("fieldset_file2")[0].style.display = "block";  
    }
}  

opt_18_0.onclick=oneortwo;  
opt_18_1.onclick=oneortwo;

Possible duplicate of [getElementsByClassName() doesn't work in old Internet Explorers like IE6, IE7, IE8](http://stackoverflow.com/questions/6584635/getelementsbyclassname-doesnt-work-in-old-internet-explorers-like-ie6-ie7-i) — krillgar, Jan 09 '17 at 13:52
Not sure if attaching an event like this works in IE. Try `attachEvent` https://msdn.microsoft.com/en-us/library/ms536343(v=vs.85).aspx — GôTô, Jan 09 '17 at 13:53
And the html has no button inside to trigger the event. The code should be triggered by clicking on the radio-button. Maybe thats the thing the older IE-Versions don't like? I will try it with another event and another object. — Ferkels, Jan 10 '17 at 10:11

score 0 · Answer 1 · edited May 23 '17 at 12:13

0

There is no problem with the if-else block here.

It is the problem of using getElementsByClassName method, which is not supported by old Internet Explorers like IE6, IE7, IE8

Check out this, You can find a detailed discussion about it there.

getElementsByClassName() doesn't work in old Internet Explorers like IE6, IE7, IE8

UPDATE

Here is what i tried to do in IE>8 and it worked.

Take a look,

Also, make sure you have set id of checkbox correctly to opt_18_0

function oneortwo() {
    if(document.getElementById("opt_18_0").checked) {
        document.getElementsByClassName("fieldset_file2")[0].style.display = "none";              
    } else {
        document.getElementsByClassName("fieldset_file2")[0].style.display = "block";  
    }
}

<input type='checkbox' id="opt_18_0">
<input type='text' class="fieldset_file2">
<button onclick="oneortwo()">Check</button>

Codepen link http://codepen.io/nadirlaskar/pen/VPvoQz

Here is a link to cross-browser-testing

https://app.crossbrowsertesting.com/livetests/run?url=http%3A%2F%2Fcodepen.io%2Fnadirlaskar%2Ffull%2FVPvoQz

edited May 23 '17 at 12:13

Community

1
1

answered Jan 09 '17 at 13:51

Nadir Laskar

4,012
2
16
33

OP mentions their code does not work in IE under Edge, there is no mention it fails *only* in IE < 9 – GôTô Jan 09 '17 at 13:58
The question should be this or else IE supported getElementsByClassName from IE9 http://caniuse.com/#feat=getelementsbyclassname – Nadir Laskar Jan 09 '17 at 14:04
This is obviously wrong: https://msdn.microsoft.com/en-us/library/ff975198(v=vs.85).aspx – GôTô Jan 09 '17 at 14:06
Your source too confirms it supported `getElementsByClassName` from IE9. – Nadir Laskar Jan 09 '17 at 14:09
I assumed the question should be from IE9 instead of Edge as other assumption makes no sense and the question should be edited to reflect so. – Nadir Laskar Jan 09 '17 at 14:12
well, maybe the code does not work in IE11 and there are more problems thant just `getElementsByClassName` :) – GôTô Jan 09 '17 at 14:15
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/132708/discussion-between-nadir-laskar-and-goto). – Nadir Laskar Jan 09 '17 at 14:21
Thanks @GôTô and Nadir Laskar! But this is not the problem. I want to run the code on IE 9, 10, 11 and Edge. On Edge it's completely working. But not on 9 to 11. When I try to use ".getElementsByClassName" outside the if-statement the code also works on IE9 to 11. So it must be a problem either with the syntax of the ".checked"-method or with the syntax of the if-else-block. But I can't find the correct variant. – Ferkels Jan 10 '17 at 07:56
@Ferkels have you tried changing the way you attach the event as I suggested on the comment of the question? – GôTô Jan 10 '17 at 09:33
@GôTô: Yes, I did it now and it helped. I did not use "attachEvent" but the newer version (supported since IE9) "addEventListener()" I still don`t understand why this works:"window.onload=display_none;" and – Ferkels Jan 12 '17 at 09:13
why this: opt_18_0.onclick=oneortwo; have to be replaced by this: document.getElementById("opt_18_0").addEventListener('click', reference_to_oneortwo , false); – Ferkels Jan 12 '17 at 09:23

Ferkels · Answer 2 · 2017-01-12T09:52:10.510

The solution (to make the code work also in IE 9 to 11) was to set the function as a variable:

    var reference_to_oneortwo = function oneortwo() {

if(document.getElementById("opt_18_0").checked)

    {
        document.getElementsByClassName("fieldset_file2")[0].style.display = "none";   
    }

 else 

    {
       document.getElementsByClassName("fieldset_file2")[0].style.display = "block";

}

 }

and so to trigger the function with:

document.getElementById("opt_18_0").addEventListener('click', reference_to_oneortwo , false);
document.getElementById("opt_18_1").addEventListener('click', reference_to_oneortwo , false);

instead of:

opt_18_0.onclick=oneortwo;
opt_18_1.onclick=oneortwo;

java script: "if-block doesn't work in IE lower than Edge"

2 Answers2