我的网站,使用jquery / javascript,在ie9中不起作用,我不知道为什么

时间:2013-06-24 16:24:46

标签: javascript jquery internet-explorer

我不够熟练,无法弄清楚IE9中有哪些部分正在瘫痪。我有一个显示单词的游戏,当他们点击一个div时,它会动画一个翻转动作并显示与该单词相关的描述。

在IE9中,它会加载第一个单词,但不会设置动画并显示说明。这是我在jquery / javascript中创建的第一件事。这是一个弗兰肯斯坦的怪物,有几个不同的jquery库和一些javascript。

为了让这个工作起作用,我需要研究什么?

以下是代码:

        <script src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
      // Load jQuery
      google.load("jquery", "1");   
    </script>
    <script src="js/jquery-ui-1.7.2.custom.min.js"></script>
    <script src="js/jquery.flip.min.js"></script>
    <script src="js/jquery.xml2json.js" type="text/javascript" language="javascript"></script>
    <script type="text/javascript">
    var cC = 0;
    var flashcards;
    var aCards = [];
    var totalCards = Number(0);
    var cardToggle = Boolean(false); //not Flipped to start out
    $.get('xml/den204_fc_module01.xml', function(xml) {
        var flash = $.xml2json(xml);
        flashcards = flash.card;
        for (var i = 0, len = flashcards.length; i < len; i++) {
            var tempCards = flashcards[i];
            aCards.push({
                t: tempCards.term,
                d: tempCards.def
            });

            function shuffle(array) { // from: http://stackoverflow.com/questions/6274339/how-can-i-shuffle-an-array-in-javascript
                var counter = array.length, temp, index;
                while (counter > 0) {
                    index = (Math.random() * counter--) | 0;
                    temp = array[counter];
                    array[counter] = array[index];
                    array[index] = temp;
                }

                return array;
            }

            shuffle(aCards);
            totalCards = aCards.length;
            $('#containerFront').text(aCards[cC].t);
            $("#previousSet").addClass("disabled");
        }
    });
    $(document).ready(function() {
        $("#clickableCard").click(function() {
            if (cardToggle === false) {
                console.log('cardToggle is equal to false');
                cardToggle = true;
                $("#flipbox").flip({
                    direction: "tb",
                    color: "#ffd699",
                    content: "<div id='containerBack'>" + aCards[cC].d + "</div>",
                    speed: 400,
                });
            } else {
                console.log('cardToggle is equal to true');
                cardToggle = false;
                $("#flipbox").flip({
                    direction: "bt",
                    color: "#adc2d6",
                    content: "<div id='containerFront'>" + aCards[cC].t + "</div>",
                    speed: 400,
                });
            }
            return false;
        });
        $("#navi").click(function() {
            if (cardToggle === true) {
                console.log('cardToggle is equal to true');
                cardToggle = false;
                $("#flipbox").flip({
                    direction: "bt",
                    color: "#adc2d6",
                    content: "<div id='containerFront'>" + aCards[cC].t + "</div>",
                    speed: 200,
                });
            }
            if (cC === 0) {
                $("#previousSet").addClass("disabled");
            } else {
                $("#previousSet").removeClass("disabled");
            }
            if (cC == (totalCards - 1)) {
                $("#nextSet").addClass("disabled");
            } else {
                $("#nextSet").removeClass("disabled");
            }
        });
        $("#nextSet").click(function() {
            console.log(cC);
            if (cC < (totalCards - 1)) {
                ++cC;
                $('#containerFront').text(aCards[cC].t);
                $('#containerBack').text(aCards[cC].d);
            } else {
                console.log("cC is not less than or equal the total number of cards!");
            }
        });
        $("#previousSet").click(function() {
            console.log(cC);
            if (cC > 0) {
                --cC;
                $('#containerFront').text(aCards[cC].t);
                $('#containerBack').text(aCards[cC].d);
            } else {
                console.log("cC is not greater then 0!");
            }
        });
    });
    </script>

2 个答案:

答案 0 :(得分:2)

删除或注释掉代码中的console.log语句。除非控制台处于打开状态,否则IE会阻塞它们。

为了解决下面的SpYk3HH评论,这来自Microsoft's own blogs之一:

  

请记住,除非你有,否则你将无法看到输出   开发人员工具打开。您可以在上面看到控制台输出   控制台或脚本选项卡。使用控制台进行调试时要小心。   如果在移动时在代码中调用控制台对象   生产,你没有显示开发人员工具   将收到一条错误消息,告诉您控制台未定义。

答案 1 :(得分:1)

从代码中删除所有console.log

在IE9中,当您处于调试模式时,console对象才处于活动状态。

如果你想记录内容,可以这样做,

if(console || console !== undefined){
   //log here
}