小编lov*_*job的帖子

JavaScript部分文件加载顺序与代码中的顺序不同

我已经放置了JS文件,以便它们应该加载以避免控制台中的任何错误并使一切正常工作,但是当我查看开发人员工具中的网络选项卡时,文件的加载方式与网页中的文件不同. .

这是代码中的顺序:

<script src="/js/lib/jquery-3.3.1.min.js"></script>
<script src="/js/lib/jquery-ui.min.js"></script>
<script src="/js/lib/bootstrap.bundle.min.js"></script> <!-- Includes popper.js -->
<script src="/js/lib/toastr.min.js"></script>

<!-- Page specific scripts -->

<script src="/js/lib/moment.min.js"></script>
<script src="/js/lib/daterangepicker.js"></script>
<script src="/js/lib/Chart.min.js"></script>

<script src="/js/partials/daterange.js"></script>
<script src="/js/partials/utils.js"></script>
<script src="/js/partials/charts.js"></script> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.16/b-1.5.1/b-html5-1.5.1/b-print-1.5.1/cr-1.4.1/datatables.min.js"></script>

<script src="/js/partials/dataTable.js"></script> 

<script src="/js/mainBundle.js"></script>
Run Code Online (Sandbox Code Playgroud)

这就是我在开发工具中获得的: 在此输入图像描述

  • 控制台中的错误,jQuery加载太晚了......(它在代码中是第一个......)

我认为可以产生影响的东西 - 我正在使用一些本地存储的JS文件,一些从cdnjs获取.

我在Laravel中使用模板(刀片)(一些脚本调用来自主模板,一些来自'特定于页面').但我认为php事先将所有内容解析在一起.

javascript jquery loading

4
推荐指数
1
解决办法
106
查看次数

如果在物体推动

我想创建仅包含x-amount数据集的对象,只有当每个datasets.data(londonTemp,nyTemp)的数据都高于0.我的尝试是放在if第二个数据集对象的前面,但不能做它.

var container = {
    temp : {
        labels: "",
        datasets: [
            { 
              label: "London", 
              type: "bar",
              data: londonTemp
            },
            {                          // this object
              label: "NY",             // to exist
              type: "line",            // only if
              data: nyTemp             // nyTemp > 0
            }
       ]
    }
};
Run Code Online (Sandbox Code Playgroud)

javascript

2
推荐指数
1
解决办法
37
查看次数

Chart.js 更新函数(chart,labels,data) 不会更新图表

我无法调试以下代码。我想更新图表数据(不是在顶部添加;删除当前数据并添加全新的数据集)。(非)codepen 上的工作示例:

https://codepen.io/anon/pen/bvBxpr

var config = {
  type: 'line',
  data: {
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [{
       label: "My First dataset",
       data: [65, 0, 80, 81, 56, 85, 40],
       fill: false
    }]
   }
 };

    var ctx = document.getElementById("myChart").getContext("2d");
    var myChart = new Chart(ctx, config);

    labelsNew = ["Why", "u", "no", "work", "???"];
    dataNew = [2, 4, 5, 6, 10];

    function updateData(chart, label, data) {
      removeData();
      chart.data.labels.push(label);
      chart.data.datasets.forEach((dataset) => {
        dataset.data.push(data);
      });
      chart.update();
    };

function removeData(chart) {
    chart.data.labels.pop(); …
Run Code Online (Sandbox Code Playgroud)

javascript chart.js

1
推荐指数
1
解决办法
6334
查看次数

JS 控制台中的“initMap 不是函数”错误(Google Maps API)

我很感激现在已经多次询问它,但是我找不到解决它的方法并将带有 initMap 函数的脚本作为单独的文件加载。

让我解释:

我正在调用 Google Maps API:

<script src="https://maps.googleapis.com/maps/api/js?key=MYAPIKEY&callback=initMap" async
  defer></script>
Run Code Online (Sandbox Code Playgroud)

其次是我捆绑的包含 initMap 函数的主 JS 文件。

<script src="/js/main.js"></script>
Run Code Online (Sandbox Code Playgroud)

我有标题中的错误。

我试图做的事情:

  • 首先加载 main.js - 同样的错误。
  • 在 head 部分移动两个脚本 - 相同的错误。
  • 第二次加载 main.js - 同样的错误。
  • 拆分页面顶部(头部)和底部(正文结束之前)(每种方式)之间调用的两个脚本 - 相同的错误。

有效的是按照以下方式调用页面内的函数:

<script>
   function initMap() {
   //rest of the code
</script>
Run Code Online (Sandbox Code Playgroud)

并将其放在 api 调用之后。

我很欣赏这是控制台错误消息初始问题的解决方案,但我想从主 js 文件中启动并调用此函数,就像我对其余 JS 所做的一样。

任何帮助和解释,将不胜感激:) 谢谢

编辑 1 - 在下面添加更多代码并将函数移动到 main.js 文件的顶部

所以 main.js 现在看起来像 - webpack blob 开头,然后是:

function initMap() {
    var uluru = { lat: 40.741895, lng: …
Run Code Online (Sandbox Code Playgroud)

javascript google-maps asynchronous

0
推荐指数
1
解决办法
1040
查看次数

在JS中切片并平均(减少)数组

我有一个数组:

var data = [0,1,2,3,4,5];

我想拼接成[0,1,2][3,4,5],随后通过取平均值所以最终的结果将是:

var dataOptimised = [1,4];

这是我到目前为止发现的:

function chunk (arr, len) {

    var chunks = [];
    var i = 0;
    var n = arr.length;

    while (i < n) {
      chunks.push(arr.slice(i, i += len)); // gives [[0,1,2] [3,4,5]]
    }

    return chunks;

};
Run Code Online (Sandbox Code Playgroud)

如何减少它?

谢谢

javascript arrays reduce slice

0
推荐指数
1
解决办法
741
查看次数