Как инициализировать бутстрап-классифицировать? - PullRequest
0 голосов
/ 24 октября 2019

Я пытаюсь создать простую статическую страницу, которая использует эту библиотеку начальной загрузки . Я попытался просмотреть несколько фрагментов кода для подсказок о том, как его реализовать. Я почти уверен, что по крайней мере нужно сделать один шаг - добавить .bs-classify к элементу HTML, но пока что ничего полезного не произошло. У меня нет ошибок на консоли js, и все ресурсы загружаются без проблем.

Ниже приведен фрагмент того, что находится в index.html

<link href="https://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js" integrity="sha256-G7A4JrJjJlFqP0yamznwPjAApIKPkadeHfyIwiaa9e0=" crossorigin="anonymous"></script>


<script src="js/ism-u.config.js"></script>
<script src="js/ism.js"></script>
<script src="js/bootstrap-classify.js"></script>
<link href="css/bootstrap-classify.css" rel="stylesheet">

Ответы [ 2 ]

0 голосов
/ 02 ноября 2019

Этот ответ только для того, чтобы дать вам кое-что для начала. Я не тщательно изучил код библиотеки bs-classify. Таким образом, я предполагаю, что в этом коде намного больше. Я просто не понимаю, почему этот код не документирован.

Тем не менее, метод ниже прост. Он просто создает секретный объект с минимальной конфигурацией. Вам необходимо прочитать параметры кода, чтобы понять, какие параметры есть в коде.

Кроме того, вам придется выяснить, как установить классификацию с использованием параметров, поскольку я не мог понять, почему это не работает. Я оставил это в конструкторе, чтобы вам было на что посмотреть. Тем не менее, реальный код установщика классификации в ответе - оператор .setClassification ().

Кроме того, я не пытался использовать Plugin API.

Для приведенного ниже кода вы можете попробоватьнажав на основную кнопку.

<html>
<head>
  <link href="https://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
  <link href="css/bootstrap-classify.css" rel="stylesheet">
  <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
  <script src="https://netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js" integrity="sha256-G7A4JrJjJlFqP0yamznwPjAApIKPkadeHfyIwiaa9e0=" crossorigin="anonymous"></script>

  <script src="js/ism-u.config.js"></script>
  <script src="js/ism.js"></script>
  <script src="js/bootstrap-classify.js"></script>
  <script>
      window.onload = function() {
          var abc = new $.fn.classify.Constructor(document.getElementById("test-1"),
                                                            {classification: ['TS'],
                                                             title: "Classification Box",
                                                             mode: "modal"});
          console.log(abc.getClassification());
          abc.setClassification("TS");
          console.log(abc.getClassification());
      }
  </script>
</head>
<body>

<button type="button" class="btn btn-primary" id="test-1">Primary</button>
<button type="button" class="btn btn-secondary">Secondary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-light">Light</button>
<button type="button" class="btn btn-dark">Dark</button>

<button type="button" class="btn btn-link">Link</button>    
</body>
</html>
0 голосов
/ 01 ноября 2019

Просматривая их исходный код и пытаясь реконструировать его, он выглядит так, как вы хотите:

$.fn.classify

или

$.fn.classify.Constructor

Если это не так,затем сообщите мне, и я попытаюсь обновить этот ответ.

Для $.fn.classify единственным параметром является объект параметров, который имеет следующие возможные свойства:

  • формат - можетбыть "bl" или "pm"
  • без - вероятно, логический
  • вход - вероятно, логический
  • relto - выглядит как логическое
  • fgi - выглядитлогический
  • mode - может быть "модальным"
  • title - скорее всего строка (заголовок)
  • container
  • viewport
  • селектор - выглядит как запрос селектора
  • заголовки
  • nonic
  • btnsize
  • триграфы
  • тетраграфы
  • обновление
  • обратный вызов - скорее всего, функция
  • fdr - логическое
...