Не удалось получить мой первый виджет jquery под моим поясом

Я хочу использовать следующий слайдер http://jqueryui.com/demos/slider/#range Я хочу, чтобы все файлы были локальными, поэтому я могу работать в автономном режиме. Сейчас все, что я пытаюсь сделать, это получить демонстрационную страницу, на которой отображается только этот слайдер. Я считаю, что моя борьба: какие js, css файлы мне нужно скачать/включить? Как только я получу этот первый под моим поясом, я должен бежать.

Спасибо за помощь.

редактировать:

Поэтому я загрузил код, поместил свой html файл в каталог, в котором находятся остальные папки, и ничего не получаю. Чтобы быть более ясным. У меня есть папка с моим файлом HTML, css, пакетом development-bundle и js. Здесь мой код: сценарий был схвачен из демонстрации jquery. Я уверен, что я делаю этот WAYYYY более сложным, чем нужно. Благодарю.

<div>

<p>
 <label for="amount">Price range:</label>
 
</p>



</div>
1 ответ

JavaScript в вашем теге скрипта выполняется перед html в теге body, поэтому jQuery не может разрешить эти селекторы. Попробуйте дождаться загрузки DOM перед выполнением JS.

$(document).ready(function(){
 // $( "#slider-range" ) ...
 // $( "#amount" )...
});

Fwiw, для небольших проектов, подобных этому, я почти всегда начинаю с предупреждения ("test") или console.log("test") внутри этой функции готовности документа. Это быстрый и простой способ узнать, загружаются ли ваши библиотеки и что JS работает правильно с самого начала.

licensed under cc by-sa 3.0 with attribution.