Question

我是StackOverflow的新手，我想问一下是否有人可以帮我修改我的代码。我不能使SmartWizard jquery 4工作。我绝对复制了每一行代码（除了css和js文件的来源）但它仍然无效。我很抱歉，但我不知道出了什么问题，我只是一个编码的新手，我希望你能帮我理解这个小问题。

我会在这里附上我的源代码和图片。

我希望复制的Jquery SmartWizard代码来自http://techlaboratory.net/smartwizard。下载Zip文件并打开zip文件的examples文件夹下的index.html文件。

以下是我要复制的代码的输出： Output of the code I wish to copy

这是我的源代码。

<!DOCTYPE html>
<html>
<head>
     <title>Smart Wizard - a JavaScript jQuery Step Wizard plugin</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">

      <!-- Only difference is i'm using Bootstrap 4 -->
      <link rel="stylesheet" 
      href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" 
      integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" 
      crossorigin="anonymous"/>

  <link href="/sample2/resources/css/smart_wizard.min.css" rel="stylesheet" type="text/css" />
  <link href="/sample2/resources/css/smart_wizard_theme_circles.min.css" rel="stylesheet" type="text/css" />
  <link href="/sample2/resources/css/smart_wizard_theme_circles.min.css" rel="stylesheet" type="text/css" />
  <link href="/sample2/resources/css/smart_wizard_theme_circles.min.css" rel="stylesheet" type="text/css" />

</head>

<body>

 //the same as the code in index

 <script type="text/javascript" src="/sample2/resources/js/jquery.smartWizard.min.js"></script>

</body>
</html>

这是我的项目文件夹架构：project folder architecture

以下是我的代码的输出：My output

我再次感到抱歉，我只是编码的新手，感谢您回复我的问题。

编辑：我刚刚发现Jquery SmartWizard 4不兼容/不能与Bootstrap 4一起根据评论使用，但有人认为它可以使用，正如评论者所说，“它在修改后有效。我仍然有小问题解决。谢谢“。有谁知道如何让Jquery SmartWizard 4与Bootstrap 4配合使用？非常感谢！

EDIT2：我现在使用Bootstrap 4，这就是我所做的：

更改了这行代码：

自： <script type="text/javascript" src="/sample2/resources/js/jquery.smartWizard.min.js"></script>

在此语法中，它会获取此版本的SmartWizard Jquery SmartWizard 4.2.2 is being fetched.

要： <script type="text/javascript" src="/sample2/resources//js/jquery.smartWizard.min.js"></script>

在此语法中，它会获取最新版本的SmartWizard Jquery SmartWizard 4.3.1 is being fetched.

现在我的问题是，额外的斜线如何对SmartWizard如何获取其版本产生影响，我很想知道原因。非常感谢！但现在我能够使Jquery SmartWizard 4.3.1与Bootstrap配合使用。

Answer 1

为了让Jquery SmartWizard 4与Bootstrap 4兼容，我不得不更改代码行

自：

<script type="text/javascript" src="/sample2/resources/js/jquery.smartWizard.min.js"></script>

要：

<script type="text/javascript" src="/sample2/resources//js/jquery.smartWizard.min.js"></script>

我为css文件做了同样的事情，所以它现在看起来像

<link href="/sample2/resources//css/smart_wizard.min.css" rel="stylesheet" type="text/css" />

使用缩小版本，因为当我使用缩小版本但链接的语法是“/sample2/resources/css/smart_wizard.min.css”时，文档会获取SmartWizard v4.x版本。我绝对不知道为什么会发生这种情况，在资源更改正在使用的版本之后添加额外的斜杠，所以如果有人可以提供它的答案那就太棒了！非常感谢！干杯！

我不能使SmartWizard Jquery 4与Bootstrap 4

1 个答案: