Я пытаюсь создать веб-интерфейс с помощью js, jquery, nvd3 и т. Д. Поскольку у них много библиотек и файлов сценариев, я решил заняться серфингом в Интернете и найдите способ загрузки их в правильном порядке, чтобы не иметь ошибок зависимостей.Js, JQuery и другие скрипты загружены, но не работают
Я нашел этот код, который совместим с большинством браузеров и, теоретически, должен работать. По-видимому, он работает правильно, потому что сценарии перечислены как загруженные в сетевой тег Chrome, и консоль ничего не показывает (кроме сообщений, которые я ожидал), но сеть не делает то, что ожидалось:
function addEvent(element, event, fn) {
if (element.addEventListener) {
element.addEventListener(event, fn, false);
} else if (element.attachEvent) {
element.attachEvent('on' + event, fn);
}
}
function loadScript(src, callback)
{
console.log("cargando");
var s,
r,
t,
write;
write = src.split("/");
// this is useless. It's just for an animation
//document.getElementById('loadingContent').innerHTML = 'Loading ... ' + write[(write.length - 1)] + ' ... ';
r = false;
s = document.createElement('script');
s.type = 'text/javascript';
s.src = src;
s.onload = s.onreadystatechange = function() {
if (!r && (!this.readyState || this.readyState == 'complete'))
{
r = true;
if (callback !== undefined) {
callback();
}
}
};
t = document.getElementsByTagName('script')[0];
t.parentNode.insertBefore(s, t);
}
addEvent(window, 'load', function(){ loadScript(
'http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js',
function() {
loadScript('https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js',
function() {
loadScript('https://cdnjs.cloudflare.com/ajax/libs/nvd3/1.1.15-beta/nv.d3.min.js',
function() {
loadScript('/static/js/jquery-ui.min.js'),
function() {
loadScript('/static/js/chart.js');
};
});
});
});
});
function mensaje() {
console.log("LOADED");
}
mensaje()
Одна из самых странных вещей, которые я видел, это то, что последняя функция («mensage») печатает ее консольный журнал, первый из которых является последним!
Вот мой html-код («странные» вещи - теги django). Я оставил файлы CSS без причины (возможно, как только я могу сделать эту работу я буду включать их в загрузочном скрипте):
{% extends "pvpc/base.html" %}
{% block title %}<title>Consumo</title>{% endblock %}
{% load staticfiles %}
{% block scripts %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/nvd3/1.1.15-beta/nv.d3.min.css" charset="utf-8"></script>
<link rel="stylesheet" href="{% static "css/jquery-ui.min.css" %}">
<script src="{% static "js/load_plus.js" %}"></script>
{% endblock %}
{% block header %}<h1>CONSUMO</h1>{% endblock %}
{% block section %}
</head>
<body>
<form>
<div id="radio">
<input type="radio" id="radio1" name="radio" value="1"><label for="radio1">2.0A</label>
<input type="radio" id="radio2" name="radio" value="2"><label for="radio2">2.0DHA</label> <!-- <input checked="checked"> -->
<input type="radio" id="radio3" name="radio" value="3"><label for="radio3">2.0DHS</label>
</div>
</form>
<p>
<label for="amount">Periodo horario:</label>
<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<p id="slider"></p>
<label for="date">Date</label>
<input type="text" id="date" name="Fecha">
<div id="piechart"><svg></svg></div>
<div id="chart"><svg></svg></div>
</body>
</html>
{% endblock section %}
Я действительно потерял с этим, потому что я пытался Evrything, но не могу найти ошибка ... Я думаю, что это должна быть небольшая вещь, которая заставляет все работать.
_ "но сеть не делает то, что ожидалось" _ не описывает, что ваша фактическая проблема, что именно не работает? –
В принципе ничего, если бы я знал, что ты думаешь, я бы это исправил? – XcodeX
Как вы знаете, что это сломано, если вы не знаете, что не работает? Например, скрипты не выполняются или объекты, созданные в сценариях, недоступны (т. Е. Вы не можете использовать объект jQuery) –