2015-03-28 2 views
0

Я пытаюсь реализовать красивое поле для множественного выбора, используя loudev multi-select.js. Я выполнил шаги на странице, но ничего не происходит - отображается только обычный кратный <select>. Пути к multi-select.css и jquery.multi-select.js в порядке.jQuery Loudev multiselect не работает

Я не могу понять, что случилось:

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
<link href="/css/multi-select.css" media="screen" rel="stylesheet" type="text/css"> 
    </head> 
    <body> 

    <select multiple="multiple" id="my-select" name="my-select[]"> 
     <option value='elem_1'>elem 1</option> 
     <option value='elem_2'>elem 2</option> 
     <option value='elem_3'>elem 3</option> 
     <option value='elem_4'>elem 4</option> 
     <option value='elem_100'>elem 100</option> 
    </select> 
    <script src="/js/jquery.multi-select.js" type="text/javascript"></script> 
<script> 
$('#my-select').multiSelect({}); 
</script> 
    </body> 
</html> 

ответ

1

Код выше работает прекрасно. Вам нужно нажать на клавишу CTRL и сделать несколько вариантов. Вы хотите видеть выбранные элементы в отдельном окне справа, как показано на веб-сайте разработчика?

<html> 
<head> 
<script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 
<link href="css/multi-select.css" media="screen" rel="stylesheet" type="text/css"> 
    </head> 
<body> 

<select multiple="multiple" id="my-select" name="my-select[]"> 
    <option value='elem_1'>elem 1</option> 
    <option value='elem_2'>elem 2</option> 
    <option value='elem_3'>elem 3</option> 
    <option value='elem_4'>elem 4</option> 
    <option value='elem_100'>elem 100</option> 
</select> 
<script src="js/jquery.multi-select.js" type="text/javascript"></script> 
<script> 
    $('#my-select').multiSelect({}); 
</script> 
</body> 
</html> 

Я думаю, вы допустили небольшую ошибку при размещении файлов css и js. Обратите внимание, что я удалил главную косую черту перед файлом JS и CSS, и он отлично работает для меня. Я предполагаю, что вы имеете следующую структуру каталогов файл

  • HTML файл
  • JS/JS внутри здесь
  • CSS/CSS файл внутри здесь
+0

Точно, я хочу видеть правую рамку с выбранными элементами. – bladerz

+0

Проверьте изменение, которое я сделал в приведенном выше коде, в вашем коде была дополнительная косая черта, и я считаю, что ваш файл HTML и папки для JS и CSS находятся на одном уровне в иерархии файлов. –

+0

Как я уже говорил, пути были в порядке. Даже с вашей версией он не работал. Я нашел проблему, однако, благодаря вашей уверенности, что она работает на вашей стороне. Пожалуйста, проверьте мой ответ. Большое спасибо за помощь! – bladerz

0

Ну я нашел моя проблема - это потому, что я m, используя https://, чтобы загрузить страницу. В этом случае ссылка на jQuery должна быть также https в противном случае браузер игнорирует их:

<script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 

Благодаря Рахули Kadukar и его ответ, чтобы указать мне, что код в целом ОК.

Смежные вопросы