Javascript 使用jQuery将数据传递给外部函数_Javascript_Jquery

Javascript 使用jQuery将数据传递给外部函数

javascript jquery

Javascript 使用jQuery将数据传递给外部函数,javascript,jquery,Javascript,Jquery,我有以下代码： var compliments = { complimentLocation: '.compliment', currentCompliment: '', complimentList: { 'morning': mycompliments.morning, 'afternoon': mycompliments.afternoon, 'evening': mycompliments.evening }

我有以下代码：

var compliments = {
    complimentLocation: '.compliment',
    currentCompliment: '',
    complimentList: {
        'morning': mycompliments.morning,
        'afternoon': mycompliments.afternoon,
        'evening': mycompliments.evening
    },
    updateInterval: mycompliments.interval || 30000,
    fadeInterval: mycompliments.fadeInterval || 4000,
    intervalId: null
};

compliments.updateCompliment = function () {

    var _list = [];

    var hour = moment().hour();

    if (hour >= 3 && hour < 12) {
        _list = compliments.complimentList['morning'].slice();
    } else if (hour >= 12 && hour < 17) {
        _list = compliments.complimentList['afternoon'].slice();
    } else if (hour >= 17 || hour < 3) {
        _list = compliments.complimentList['evening'].slice();
    } else {
        Object.keys(compliments.complimentList).forEach(function (_curr) {
            _list = _list.concat(compliments.complimentList[_curr]).slice();
        });
    }

    var _spliceIndex = _list.indexOf(compliments.currentCompliment);

    if (_spliceIndex !== -1) {
        _list.splice(_spliceIndex, 1);
    }

    var _randomIndex = Math.floor(Math.random() * _list.length);
    compliments.currentCompliment = _list[_randomIndex];

    $('.compliment').updateWithText(compliments.currentCompliment, compliments.fadeInterval);

}

compliments.init = function () {

    this.updateCompliment();

    this.intervalId = setInterval(function () {
        this.updateCompliment();
    }.bind(this), this.updateInterval)

}


function functionToLoadFile(){
    jQuery.get('js/mycompliments.js', function(data) {

        var compliments = {
            complimentLocation: '.compliment',
            currentCompliment: '',
            complimentList: {
                'morning': mycompliments.morning,
                'afternoon': mycompliments.afternoon,
                'evening': mycompliments.evening
            },
            updateInterval: mycompliments.interval || 30000,
            fadeInterval: mycompliments.fadeInterval || 4000,
            intervalId: null


        };

        console.log(compliments);

        setTimeout(functionToLoadFile, 5000);
    });
    compliments.reload = function (compliments) {

        compliments.updateCompliment(compliments);
    }
}
setTimeout(functionToLoadFile, 5000);

更改：

compliments.updateCompliment = function () {

致：

在functionToLoadFile（）中，将ajax调用更改为：

jQuery.get('js/mycompliments.js', function(data) {

    var compliments1 = {
        complimentLocation: '.compliment',
        currentCompliment: '',
        complimentList: {
            'morning': mycompliments.morning,
            'afternoon': mycompliments.afternoon,
            'evening': mycompliments.evening
        },
        updateInterval: mycompliments.interval || 30000,
        fadeInterval: mycompliments.fadeInterval || 4000,
        intervalId: null
    };

    console.log(compliments1);
    compliments.updateCompliment(compliments1);
    setTimeout(functionToLoadFile, 5000);
});

但最重要的是阅读一些关于类概念的教程。

不要加载JavaScript文件并直接从中读取数据。这是一种坏习惯。将您的mycompliments.js文件转换为JSON并按原样使用

get（）

加载它。然后使用回调中的数据参数来实际填充数据

我还建议你用一根短绒

js/mycompliments.json

{
    "morning": [
        "Good morning, handsome!",
        "Enjoy your day!",
        "How was your sleep?"
    ],
    "afternoon": [
        "etc"
    ],
    "evening": [
        "weiik"
    ]
}

main.js

/*jslint browser: true, nomen: true*/
/*global jQuery, moment*/

(function () {

    "use strict";

    // Function to do UI updates
    function updateUI(compliments) {

        var _list = [],
            hour = moment().hour(),
            _spliceIndex,
            _randomIndex;

        if (hour >= 3 && hour < 12) {
            _list = compliments.complimentList.morning.slice();
        } else if (hour >= 12 && hour < 17) {
            _list = compliments.complimentList.afternoon.slice();
        } else if (hour >= 17 || hour < 3) {
            _list = compliments.complimentList.evening.slice();
        } else {
            Object.keys(compliments.complimentList).forEach(function (_curr) {
                _list = _list.concat(compliments.complimentList[_curr]).slice();
            });
        }

        _spliceIndex = _list.indexOf(compliments.currentCompliment);

        if (_spliceIndex !== -1) {
            _list.splice(_spliceIndex, 1);
        }

        _randomIndex = Math.floor(Math.random() * _list.length);
        compliments.currentCompliment = _list[_randomIndex];

        jQuery(".compliment")
            .updateWithText(compliments.currentCompliment, compliments.fadeInterval);

    }

    // Function to deal with updating compliments
    function updateCompliments() {
        jQuery.get("js/mycompliments.json", function (data) {

            var jsonData,
                compliments;

            // Parse data
            jsonData = JSON.parse(data);

            // Update with gotten data
            compliments = {
                complimentLocation: ".compliment",
                currentCompliment: "",
                complimentList: {
                    "morning": jsonData.morning,
                    "afternoon": jsonData.afternoon,
                    "evening": jsonData.evening
                },
                updateInterval: jsonData.interval || 30000,
                fadeInterval: jsonData.fadeInterval || 4000,
                intervalId: null
            };

            updateUI(compliments);

            // Do this again in a little while
            setTimeout(updateCompliments, compliments.updateInterval);
        });
    }

    // Run update at DOM load
    document.addEventListener("DOMContentLoaded", updateCompliments);

}());

/*jslint浏览器：true，nomen:true*/
/*全局jQuery，时刻*/
（功能（）{
“严格使用”；
//用于执行UI更新的函数
函数更新（恭维）{
var_list=[]，
小时=时刻（）.hour（），
_剪接索引，
_随机指数；
如果（小时>=3和小时<12）{
_list=compaids.compaindlist.morning.slice（）；
}否则，如果（小时数>=12和小时数<17）{
_list=恭维。恭维列表。午后。切片（）；
}否则，如果（小时>=17 | |小时<3）{
_list=compaids.compaindlist.night.slice（）；
}否则{
Object.key（compaids.compaindlist）.forEach（function（\u curr）{
_list=_list.concat（compaids.compaindlist[_curr]）.slice（）；
});
}
_拼接索引=_list.indexOf（compaids.currentcompaind）；
如果（索引！=-1）{
_拼接列表（拼接索引，1）；
}
_randomIndex=Math.floor（Math.random（）*_list.length）；
恭维。当前恭维=_列表[_随机索引]；
jQuery（“赞美”）
.updateWithText（恭维语.Current恭维语，恭维语.fadeInterval）；
}
//处理更新恭维语的函数
函数updateComplements（）{
get（“js/mycompliments.json”），函数（数据）{
var jsonData，
赞美；
//解析数据
jsonData=JSON.parse（数据）；
//使用获取的数据进行更新
恭维话={
恭维地点：“.恭维”，
当前恭维语：“，
恭维名单：{
“早晨”：jsonData.morning，
“下午”：jsonData.午后，
“晚上”：jsonData.night
},
更新间隔：jsonData.interval | | 30000，
fadeInterval:jsonData.fadeInterval | | 4000，
有效期：空
};
更新（恭维）；
//过一会儿再做一次
setTimeout（updateComplements、complements.updateInterval）；
});
}
//在DOM加载时运行更新
文件。addEventListener（“DOMContentLoaded”，UpdateCompletions）；
}());

你的

赞美。更新赞美（赞美）未被调用，因为它被包装在恭维.reload
函数中
您可以通过调用全局compaims.updateCompliment
函数并将compaims
作为参数传递，使其工作
然而，需要指出的是：
var-compaids
被重复定义，因此被functionToLoadFile
setTimeout（functionToLoadFile，5000）setTimeout（functionToLoadFile，5000）中调用code>
，似乎不仅每隔5秒调用一次functionToLoadFile
，而且在加载文件后，它会触发另一次setTimeout
请检查

你能做的就是
删除了第一个var赞美词
替换compaids.updateCompliment=function（）{
使用var updateCompliment=function（恭维）{
将setTimeout（functionToLoadFile，5000）；
在console.log之后替换为window.updatecompletion（恭维）

你可以删除恭维。我想你也可以重新加载功能

您可以从jQuery.get（）中了解有关javascript的更多信息
为什么不使用data
参数
callback？如果你不打算使用从它那里得到的数据，那么甚至进行调用又有什么意义呢？@zero298无论如何都会更新恭维！如果我理解正确，你可以用恭维作为参数来调用它“恭维。updateCompliment（恭维）；”，但不接收恭维。updateCompliment=函数（缺失）..@delueg在控制台中，我看到当外部文件更改（因此加载）时，恭维会得到更新，但我无法将此数据传递给UpdateComplets（），并触发它刷新前端。MyComplets在哪里声明？我在您提供的代码中没有看到声明。
{
    "morning": [
        "Good morning, handsome!",
        "Enjoy your day!",
        "How was your sleep?"
    ],
    "afternoon": [
        "etc"
    ],
    "evening": [
        "weiik"
    ]
}

/*jslint browser: true, nomen: true*/
/*global jQuery, moment*/

(function () {

    "use strict";

    // Function to do UI updates
    function updateUI(compliments) {

        var _list = [],
            hour = moment().hour(),
            _spliceIndex,
            _randomIndex;

        if (hour >= 3 && hour < 12) {
            _list = compliments.complimentList.morning.slice();
        } else if (hour >= 12 && hour < 17) {
            _list = compliments.complimentList.afternoon.slice();
        } else if (hour >= 17 || hour < 3) {
            _list = compliments.complimentList.evening.slice();
        } else {
            Object.keys(compliments.complimentList).forEach(function (_curr) {
                _list = _list.concat(compliments.complimentList[_curr]).slice();
            });
        }

        _spliceIndex = _list.indexOf(compliments.currentCompliment);

        if (_spliceIndex !== -1) {
            _list.splice(_spliceIndex, 1);
        }

        _randomIndex = Math.floor(Math.random() * _list.length);
        compliments.currentCompliment = _list[_randomIndex];

        jQuery(".compliment")
            .updateWithText(compliments.currentCompliment, compliments.fadeInterval);

    }

    // Function to deal with updating compliments
    function updateCompliments() {
        jQuery.get("js/mycompliments.json", function (data) {

            var jsonData,
                compliments;

            // Parse data
            jsonData = JSON.parse(data);

            // Update with gotten data
            compliments = {
                complimentLocation: ".compliment",
                currentCompliment: "",
                complimentList: {
                    "morning": jsonData.morning,
                    "afternoon": jsonData.afternoon,
                    "evening": jsonData.evening
                },
                updateInterval: jsonData.interval || 30000,
                fadeInterval: jsonData.fadeInterval || 4000,
                intervalId: null
            };

            updateUI(compliments);

            // Do this again in a little while
            setTimeout(updateCompliments, compliments.updateInterval);
        });
    }

    // Run update at DOM load
    document.addEventListener("DOMContentLoaded", updateCompliments);

}());