热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

RequireJS影响嵌入式jquery-ui小部件

如何解决《RequireJS影响嵌入式jquery-ui小部件》经验,是哪儿的问题?

我有一个jQuery小部件,合作伙伴正试图嵌入.我们遇到的问题是合作伙伴正在使用requireJS及其影响小部件.

小部件是匿名函数,需要jquery-ui.在调试之后,我们发现在noConflict调用之后将删除jQuery UI.这是小部件的代码.

(function () {

    // Localize jQuery variable
    var jQueryWidget;

    /******** Load jQuery if not present *********/
    if (window.jQuery === undefined || window.jQuery.fn.jquery !== '3.2.1') {
        var script_tag = document.createElement('script');
        script_tag.setAttribute("type", "text/Javascript");
        script_tag.setAttribute("src", "https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js");
        script_tag.Onload= scriptLoadHandler;
        script_tag.Onreadystatechange= function () { // Same thing but for IE
            if (this.readyState == 'complete' || this.readyState == 'loaded') {
                scriptLoadHandler();
            }
        };
        (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
    } else {
        loadJQueryUi();
    }

    function scriptLoadHandler() {
        loadJQueryUi();    
    }

    function loadJQueryUi() {
    /******* Load UI *******/
        jQuery.getScript('https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js', function () {
          jQueryWidget = jQuery.noConflict(true);
          setHandlers(jQueryWidget);
        });


        /******* Load UI CSS *******/
        var css_link = jQuery("", {
            rel: "stylesheet",
            type: "text/css",
            href: "https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.css"
        });
        css_link.appendTo('head');
    }

    function setHandlers($) {
        $(document).on('focus', '#start-date, #end-date', function(){

      $('#start-date').datepicker({
        dateFormat: "M dd, yy",
        minDate: 'D',
        numberOfMonths: 1,
      });

            $('#end-date').datepicker({
                dateFormat: "M dd, yy",
                minDate:'+1D',
                numberOfMonths:1,
            });
    }
})();

使用chrome调试器,我们可以看到,当调用getScript时,它正确地将jquery-ui添加到加载的版本中.在我们调用noConflict它恢复之前的jQuery但版本不再具有jQueryUI之后.

在没有requireJS的情况下测试其他站点上的小部件是否正常工

以前有人遇到过这个吗?不幸的是我们之前没有使用过RequireJS,但是无法理解为什么它会影响匿名功能.

任何帮助将非常感激.


推荐阅读
author-avatar
Carre陈
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有