Размещение сценариев JQuery с несколькими другими сценариями?

Question

Я написал этот скрипт

 $.ajax({
     type: "POST",
     url: "/my/GetTagsByID",
     data: {
         Link_ID: LId
     },
     datatype: "json",
     success: function(result) {
         $('#tokenfield-typeahead').val('Success 1, Success 2')
     },
     error: function(jqXHR) {
         alert(jqXHR.status);
     }
 })

Вопрос в том, но я не знаю, каким должно быть точное местоположение SCRIPTS

Когда я это так:

<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/dist/typeahead.bundle.js"></script>
<link href="~/Scripts/dist/css/tokenfield-typeahead.css" rel="stylesheet" />
<script src="~/Scripts/dist/bootstrap-tokenfield.js"></script>
<link href="~/Scripts/dist/css/bootstrap-tokenfield.css" rel="stylesheet" />

Результаты следующие

Это значит, я могу использовать TokenField а также TypeAhead но это не замена значений $('#tokenfield-typeahead').val('Success 1, Success 2') что означает, что я не могу получить доступ к jQuery?

Но когда я меняю место для Jquery Сценарий к этому (перемещение JQUERY вниз):

<script src="~/Scripts/dist/typeahead.bundle.js"></script>
<link href="~/Scripts/dist/css/tokenfield-typeahead.css" rel="stylesheet" />
<script src="~/Scripts/dist/bootstrap-tokenfield.js"></script>
<link href="~/Scripts/dist/css/bootstrap-tokenfield.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.10.2.js"></script>

Я получаю следующие результаты

Я не могу использовать Tokenfield Я не могу использовать TypeAhead больше.

Что я должен сделать?

Добавлен новый код Я добавил новый код, похоже, JQuery не может распознать tokenfiled как функцию - Как я могу решить эту проблему, когда я добавил все необходимые ссылки - См. Код ниже (я получаю ту же ошибку в консоли и нет независимо от того, где я тестирую) - Пожалуйста, запустите код и нажмите кнопку

$('#bt').click(function() {

  $('#tokenfield-typeahead').tokenfield('setTokens', ['blue', 'red', 'white']);

});

<link href="http://sliptree.github.io/bootstrap-tokenfield/dist/css/bootstrap-tokenfield.css" rel="stylesheet" />
<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://sliptree.github.io/bootstrap-tokenfield/dist/bootstrap-tokenfield.js"></script>



<input type="text" class="form-control" id="tokenfield-typeahead" value="Temp 1, Temp 2" data-limit="10" placeholder="Enter tags" />

<button id="bt">Click me</button>

Answer 1

Нашел решение - Спасибо за TJ за совет запустить скрипт в консоли

Проблема была в том, что Bootstrap.min.js нужно было загрузить before Tokenfiled (JS) - это решило проблему, и теперь JQuery может идентифицировать Tokenfield как функцию и работать по назначению. Я до сих пор не понимаю, почему Bootstrap не загружался, потому что он был у меня на странице _Layout и в Bundle. В любом случае я увижу, как я могу переупорядочить свои пакеты сценариев -

Спасибо

Answer 2

... что означает, что я не могу получить доступ к jQuery?

Нет, это совсем не значит. Это просто означает, что val не делает то, что вы ожидаете.

Это меня не удивляет. Весьма вероятно, что используемый плагин tokenfield требует, чтобы вы использовали специфический для tokenfield метод для установки значений, а не val, Взглянув на документацию, кажется, tokenfield('setTokens', ...):

$('#tokenfield-typeahead').tokenfield('setTokens', 'Success 1,Success2');

Что я должен сделать?

Поместите jQuery перед любыми плагинами, так как плагинам нужен jQuery, чтобы подключиться; всегда обращайтесь к документации как к первому действию, когда все работает не так, как ожидалось; и используйте правильный метод для установки "значения" в поле токена.