Диалоговое окно jQuery не работает

#jquery #jquery-ui-dialog

#jquery #jquery-ui-dialog

Вопрос:

Я включил в свой заголовок:

 <head>
    <script type="text/javascript" src="jquery/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="jquery/jquery-ui.css">
    <link rel="stylesheet" type="text/css" href="jquery/jquery-ui.structure.css">
    <link rel="stylesheet" type="text/css" href="jquery/jquery-ui.theme.css"></script>
</head> 
  

И это в моем теле, я просто хочу это проверить, но я получаю сообщение об ошибке:

 ReferenceError: jQuery is not defined
    factory( jQuery );

<body>
      <script>
          $.extend({ alert: function (message, title) {
                      $("<div></div>").dialog( {
                        buttons: { "Ok": function () { $(this).dialog("close"); } },
                        close: function (event, ui) { $(this).remove(); },
                        resizable: false,
                        title: title,
                        modal: true
                      }).text(message);
                    }
                });

            $.alert('message', 'fileName');
      </script>
    </body>
  

Я не уверен, почему диалоговое окно не работает в моем коде. Я что-то упустил в своем скрипте или проблема в чем-то другом?

Ответ №1:

Попробуйте включить скрипт пользовательского интерфейса jQuery после скрипта jQuery, вам нужны они оба, как это (потому что jQuery UI использует jQuery и, следовательно, jQuery должен быть загружен первым)

 <head>
    <script type="text/javascript" src="jquery/jquery-3.1.1.js"></script>
    <script type="text/javascript" src="jquery/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="jquery/jquery-ui.css">
    <link rel="stylesheet" type="text/css" href="jquery/jquery-ui.structure.css">
    <link rel="stylesheet" type="text/css" href="jquery/jquery-ui.theme.css"></script>
</head> 
  

Пожалуйста, обратите внимание, чтобы использовать имеющуюся у вас версию скрипта, «jquery-3.1.1.js » это всего лишь пример.

Я сказал вам в комментарии, что вам не нужны два скрипта jQuery — обычный и уменьшенный, чтобы не удалять их оба. Итак, подведем итог

  1. jQuery = jQuery-min
  2. jQuery != jQuery-UI
  3. jQuery-UI требует, чтобы jQuery был загружен первым.

Комментарии:

1. где я могу загрузить скрипт пользовательского интерфейса и какую версию?

2. Еще одна вещь, зачем вам включать как обычную, так и уменьшенную версию скрипта jQuery? Удалите его.

3. Что должно быть включено из zip-файла, который я могу загрузить на веб-сайте jQuery?

4. включить jquery-ui.js и все файлы .css

5. Нет проблем. Смотрите мое редактирование, вы также должны включить файлы CSS.