使用带有 express.js 的 Jquery UI答案

【问题标题】：Using Jquery UI with express.js使用带有 express.js 的 Jquery UI
【发布时间】：2023-03-23 16:56:01
【问题描述】：

我正在使用一个节点主干应用程序。我创建动态内容并将可拖动的 jquery UI 添加到我创建的内容或元素中。但是，当我的模板系统呈现时，我的元素甚至不会移动。路径是正确的。我使用一个类来引用这些元素和可拖动方法。

谁能告诉我包含 jquery ui 和 jquery 脚本以便它们正确加载的正确方法是什么？

layoutjade - index.jade - index.jade中渲染的模板（扩展布局）

在我的应用程序中，我有一个连接到主干的 jquery 模块，但由于某种原因，jquery UI 没有与它连接，因此我必须在它旁边添加一个 jquery 脚本。但是，当我在模板中创建带有主干的动态元素时，jquery 将不起作用。我使用 .html() 将它们添加到模板中。

这是 layout.jade

!!! 5
html(lang="en")
  head
    title project
    meta(name='viewport', content='width=device-width, initial-scale=1.0')
    link(rel='stylesheet',href='/styles/bootstrap.css')
    link(rel='stylesheet',href='/styles/styles.css')

  body
   .navbar.navbar-inverse
    .container
        button.navbar-toggle(type='button', data-toggle='collapse', data-target='.nav-collapse')
          span.icon-bar
          span.icon-bar
          span.icon-bar
        a.navbar-brand(href='#') 
         img(src='/img/greatlogowhite.png', width='300')
        .nav-collapse.collapse
          ul.nav.navbar-nav
            li.active
             a(href='#') 
              img(src='/img/house.svg', width='70')
            li
             a(href='#about')
              img(src='/img/pen.svg', width='70')
            li
             a(href='#contact')
              img(src='/img/search.svg', width='70')
            li
             a(href='#contact')
              img(src='/img/chat.svg', width='70')

这是 index.jade

  block content
  block scripts


extends layout

block content
  div#content

block scripts
  script(data-main='js/boot', type='text/javascript',src='/js/libs/require.js')
  script(type='text/javascript', src='http://code.jquery.com/ui/1.10.3/jquery-ui.js')

这就是我尝试使用 jquery ui 的方式

<script> 
    $(document).ready(function() {
           $( ".pic" ).draggable();
    });
</script>

【问题讨论】：

向我们展示你如何加载 jquery 和 jquery ui
向我们展示您的尝试。

标签： node.js jquery-ui backbone.js express pug

【解决方案1】：

其实我是为了解决问题。使用主干、node.js 和 require.js 的人，请记住将 jquery 和 jquery UI 作为库包含在 require 中，以及在创建具有主干的动态元素时，例如：

$('#content').append(html); inside backbone call jquery UI

            $('.drag').draggable();

【讨论】：