简体   繁体   English

将Selectivizr与RequireJS(jQuery)结合使用

[英]Using Selectivizr with RequireJS (jQuery)

Has anybody got any experience of getting Selectivizr to work with IE7/8 and RequireJS? 有没有人有过让Selectivizr与IE7 / 8和RequireJS一起使用的经验?

I've tried adding the conditional comments as per usual, I've had this working no problem before, I'm running off a localhost. 我已经尝试像往常一样添加条件注释,在此之前我没有遇到任何问题,我正在运行本地主机。

I think it has something to do with jQuery needing to be run before Selectivizr, something that RequireJS seems to complicate. 我认为这与需要在Selectivizr之前运行的jQuery有关,而RequireJS似乎很复杂。

Any help would be great, cheers. 任何帮助都会很棒,欢呼。

For some reason the yepnope method didn't work, it still would load selectivizr as the first script, even before modernizr, this must be something to do with the asynchronous way yepnope works. 出于某种原因,yepnope方法不起作用,它仍然会加载selectivizr作为第一个脚本,即使在modernizr之前,这也必须与yepnope工作的异步方式有关。

The way I've solved this in my case is to add a conditional comment before my html tag 我解决此问题的方法是在html标记之前添加条件注释

<!--[if (gte IE 6)&(lte IE 8)]><html class="lt-ie9"><![endif]-->

I've then got a separate "ie-tidy.js" which I call from require js. 然后,我有一个单独的“ ie-tidy.js”,我从require js调用它。 So my config looks something like this (this is trimmed down) 所以我的配置看起来像这样(已被修剪)

requirejs.config({

paths: {
    jquery: "../jquery-1.7.2.min",
    app: ".",
    selectivizr: '../selectivizr-min'
},
"shim": {
    "cookie": ["jquery"],
    "selectivizr": ["jquery"]
}
});
requirejs(['jquery', 'app/header', 'app/ie-tidy'], function ($) {
});

Then inside my ie-tidy.js I do the following (amongst other ie-specific scripts) 然后在我的ie-tidy.js中执行以下操作(以及其他特定于ie的脚本)

define(['jquery'], function ($) {
"use strict"

$(function() {
    if ($('html.lt-ie9').size()) {
           require(['jquery', 'selectivizr']);
        }
    });
});

This works exactly how I'd like it to, loading selectivizr after jQuery and applying the selectivizr classes as expected. 这完全符合我的意愿,可以在jQuery之后加载selectivizr并按预期方式应用selectivizr类。 Thanks for your help @Dzulqarnain 感谢您的帮助@Dzulqarnain

According to the Selectivizr website you do need to specify one of the libraries defined in the table located on the front page. 根据Selectivizr网站,您确实需要指定首页中表中定义的库之一。

You could always load Selectivizr using YepNope or something similar after jQuery has been defined. 在定义jQuery之后,您始终可以使用YepNope或类似的方法加载Selectivizr。

Eg. 例如。

require.config({
    shim: {
        'yepnope' : {
            exports: 'yepnope'
        }
    },

    paths: {
        'jquery' : 'jquery-min',
        'yepnope' : 'yepnope-min'
    }
});

require(['jquery', 'yepnope'], function($){
    yepnope({
        load: ['iegt5!ielt9!selectivizr-min.js']
    });

    // do other stuff
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM