javascript - jquery 代码 fancybox 第二次显示错误

Question

我有下面的人，第一次工作正常，但下次，如果我尝试打开，我会收到错误

/* select 2 */
    $("#otherlogins").niceSelect();

    $(document).on("change",".socialselection",function() {
        var e = $(this);
        var mode = $('div.nice-select.socialselection span.current').text();
        if(e.val() == '') {
            jAlert('warning', 'Please Choose the Service which you want to use for Login', 'Oops');
        } else {
            $('<link/>', {rel: 'stylesheet',type: 'text/css',href: '/js/fancybox/jquery.fancybox-1.3.4.css'}).appendTo('head'); 
            var script_arr = [
                'jquery.fancybox-1.3.4.pack.js', 
                'jquery.mousewheel-3.0.4.pack.js', 
                'jquery.easing-1.3.pack.js'
            ];
            $.getMultiScripts(script_arr, '/js/fancybox/').done(function() {
                $.fancybox({
                    'width'         : '75%',
                    'height'        : '75%',
                    'autoScale'     : false,
                    'transitionIn'  : 'none',
                    'transitionOut' : 'none',
                    'type'          : 'iframe',
                    'href'          : 'openlogin.cfm?mode='+ mode
                });
            });
        }   
    });

问题似乎是我可能在需要时加载 fancybox，但我有点不明白为什么它会这样

多选功能

$.getMultiScripts = function(arr, path) {
        var _arr = $.map(arr, function(scr) {
            return $.getScript( (path||"") + scr );
        });

        _arr.push($.Deferred(function( deferred ){
            $( deferred.resolve );
        }));

        return $.when.apply($, _arr);
    }

当我第二次选择它时，我得到的错误是这个，

Uncaught TypeError: Cannot read property 'hide' of undefined
    at N (eval at <anonymous> (jquery.min.js:2), <anonymous>:18:284)
    at I (eval at <anonymous> (jquery.min.js:2), <anonymous>:19:43)
    at Function.b.fancybox (eval at <anonymous> (jquery.min.js:2), <anonymous>:38:325)
    at Array.<anonymous> (js.cfm:622)
    at j (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at Object.<anonymous> (jquery.min.js:2)
    at j (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at x (jquery.min.js:4)
N @ VM362:18
I @ VM362:19
b.fancybox @ VM362:38
(anonymous) @ js.cfm:622
j @ jquery.min.js:2
fireWith @ jquery.min.js:2
(anonymous) @ jquery.min.js:2
j @ jquery.min.js:2
fireWith @ jquery.min.js:2
x @ jquery.min.js:4
b @ jquery.min.js:4
XMLHttpRequest.send (async)
send @ jquery.min.js:4
ajax @ jquery.min.js:4
$.ajax @ VM146:1
m.<computed> @ jquery.min.js:4
getScript @ jquery.min.js:4
(anonymous) @ rfactor.cfm:105
map @ jquery.min.js:2
$.getMultiScripts @ js.cfm:104
(anonymous) @ js.cfm:621
dispatch @ jquery.min.js:3
r.handle @ jquery.min.js:3
trigger @ jquery.min.js:3
(anonymous) @ jquery.min.js:3
each @ jquery.min.js:2
each @ jquery.min.js:2
trigger @ jquery.min.js:3
(anonymous) @ jquery.nice-select.min.js:4
dispatch @ jquery.min.js:3
r.handle @ jquery.min.js:3

不确定问题出在哪里，

可能出了什么问题，我不确定

Answer 1

看，js是异步的，我什至不确定当你在事件中使用var定义一个变量时，这将是一个uniqe变量(所以在下一个事件之后，将会有多个来自 dom 中的每个人)，有时会赎金这样的东西......试试这个:

$(document).on("change",".socialselection",function()
{
    //let e = $(this); //you dont need this variable in this case
    let mode = $('div.nice-select.socialselection span.current').text();
    if(!$(this).val().length) //<-- I think this solution better for you but:*1
    {
        //...
    } else {
        //...
        let script_arr = //...

//...*1: if(!$(this).val().length) 将在 val() 为 null 或 时捕获>'' 或 undefined 或 0 (js 不是某种类型安全的语言，这使得测试变得困难)，但是 切勿以这种形式使用: if(!$(this).val().length > 0) 因为当值 null 或 undefined < 时，会抛出与您的答案类似的错误em>(我猜...我不是 js 专家，真的不关心这个语言，只是尝试帮助)...

$.getMultiScripts = function(arr, path) {
    let _arr = $.map(arr, function(scr) {
        return $.getScript( (path||"") + scr );
    });

    _arr.push($.Deferred(function( deferred ){
        $( deferred.resolve );
    }));

    return $.when.apply($, _arr);
}