Question

var depth = 0;
var moving = false;
var answers = new Array();
var qNo = 0;
var rangeCarousel;
var productCarousel;
var ih, iw, orient;
var sidebarOpen = false;
var focused = "range";
var currentRange = 0;

$(document).ready(function () {

    document.getElementById('intro').addEventListener('click', clickHandler);
    document.getElementById('q1').addEventListener('click', clickHandler);
    document.getElementById('q2').addEventListener('click', clickHandler);
    document.getElementById('q3').addEventListener('click', clickHandler);
    document.getElementById('q4').addEventListener('click', clickHandler);

    document.getElementById('intro').addEventListener('webkitTransitionEnd', transitionEnd);
    document.getElementById('intro').addEventListener('transitionend', transitionEnd);
    document.getElementById('intro').addEventListener('transition', transitionEnd);

});

function clickHandler(e) {
    if ((qNo < 4) && (e.target.id != 'intro')) {
        qNo++;

        if (!moving) {
            depth -= 100;
            document.getElementById('intro').style.top = (depth + '%');
            document.getElementById('q1').style.top = (depth + '%');
            document.getElementById('q2').style.top = (depth + '%');
            document.getElementById('q3').style.top = (depth + '%');
            document.getElementById('q4').style.top = (depth + '%');
            moving = true;
        }

    } else if (qNo == 4) {

        var c = e.target.parentNode.classList[0];
        switch (c) {
        case 'one':
            window.open("test.html","_self");
            break;
        case 'two':
            window.open("test.html","_self");
            break;
        case 'three':
            window.open("test.html","_self");
            break;
        case 'four':
            window.open("test.html","_self");
            break;
        }
    }

}

function transitionEnd() {
    moving = false;
}

i m trying to create a quiz where users clicks on the images then loads the answer. It works fine on ie11 but i also need to make it work on ie10. I cant see any errors or anything to show me whats wrong

Any help or suggestion will be great

Answer 1

Some old IE does not support target property. You can use e.srcElement which is an alias of target as an alias of target

((e.target || e.srcElement).id) === "intro"

& also use it to find the parentNode

Side Note :As mentioned in comment section you can use jquery as which will also reduce the number of lines in your code beside efficiently handling events

You can also use jquery multiple selector instead of writing same lines of code for attaching event to every selector.

$('sel1 ,selector2 , selector 3 ...').click(function(event){.. rest of code})

javascript not working on IE10 / No errors. Works fine on other normal browsers

1 个答案: