IE8引用jQuery报$或者jQuery未定义

最近公司做的项目要求兼容到IE8,结果在页面调试的时候出了个bug,在IE8上面一直报错$未定义,或者jQuery未定义,导致页面上面写的jQuery全部失效,在Chrome浏览器没有任何问题。很是头疼,查了半天资料页面也没找到,降低jQuery的版本(用的1.10.2,正常应该是兼容IE8的)也不行。由原因找结果,$未定义,也就是jQuery没有引进了,那么这个问题只能出现在script标签这里。原来是type的值写错了,下面详细说一下。
1.代码如下,这个在Chrome下面是正常弹出你好,没有任何问题

<html>
    <head>
        <title></title>
        <meta charset="utf-8">
        <script type="application/javascript"   src="lib/js/jQuery v1.9.1.js">
        </script>
        <script>
            $(function(){
                $("#div1").click(function(){
                    alert("你好");
                })
            })
        </script>
    </head>
    <body>
        <dvi id="div1">你好</dvi>
    </body>
</html>

但是在IE8下,报错,


原因就是这段代码:

type="application/javascript"   

将他改为

type="text/javascript"

IE真坑啊!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

 

2.之后查了 查

type="application/javascript"   

这样引入脚本是正确的,但是在IE8下会引入失败!!!!!!!!!!!!1

转载于:https://www.cnblogs.com/Gabriel-Wei/p/6573874.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下是一个简单的 jQuery 轮播图插件,支持 IE8 及以上版本: HTML: ``` <div class="slider"> <ul class="slider-list"> <li><img src="img/slider-1.jpg" alt=""></li> <li><img src="img/slider-2.jpg" alt=""></li> <li><img src="img/slider-3.jpg" alt=""></li> </ul> <div class="slider-nav"> <a href="#" class="slider-prev">Prev</a> <a href="#" class="slider-next">Next</a> </div> </div> ``` CSS: ``` .slider { position: relative; overflow: hidden; } .slider-list { position: absolute; top: 0; left: 0; width: 300%; list-style: none; margin: 0; padding: 0; } .slider-list li { float: left; width: 33.333%; height: 200px; } .slider-list li img { width: 100%; height: 100%; display: block; } .slider-nav { position: absolute; bottom: 10px; left: 50%; transform: translate(-50%, 0); z-index: 1; } .slider-nav a { display: inline-block; margin: 0 10px; padding: 5px 10px; background-color: #fff; border: 1px solid #ccc; color: #333; text-decoration: none; } ``` JavaScript: ``` $(function() { var $slider = $('.slider'); var $sliderList = $slider.find('.slider-list'); var $sliderItem = $sliderList.find('li'); var $sliderNav = $slider.find('.slider-nav'); var $sliderPrev = $sliderNav.find('.slider-prev'); var $sliderNext = $sliderNav.find('.slider-next'); var sliderCount = $sliderItem.length; var currentIndex = 0; var slideWidth = $slider.width(); var isAnimating = false; // 初始化 $sliderList.css({ width: slideWidth * sliderCount }); $sliderItem.css({ width: slideWidth }); // 上一张 $sliderPrev.on('click', function(e) { e.preventDefault(); if (isAnimating) return; currentIndex--; if (currentIndex < 0) { currentIndex = sliderCount - 1; } sliderAnimate(currentIndex); }); // 下一张 $sliderNext.on('click', function(e) { e.preventDefault(); if (isAnimating) return; currentIndex++; if (currentIndex > sliderCount - 1) { currentIndex = 0; } sliderAnimate(currentIndex); }); // 动画 function sliderAnimate(index) { isAnimating = true; $sliderList.animate({ left: -slideWidth * index }, 500, function() { isAnimating = false; }); } }); ``` 注意事项: 1. 在 IE8 中,由于不支持 CSS3 transform 属性,所以需要使用 jQuery 的 animate() 方法来实现动画效果。 2. 在 IE8 中,需要将 JavaScript 代码放在 jQuery 库文件之后,否则会出现 $ 或 jQuery 未定义的问题。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值