Question

我试图使用jsfiddle来显示基于光滑jquery的轮播。我之前没有使用过jfiddle，所以我觉得我错过了一些东西。我试图利用它与同学就项目的想法进行合作。

问题是当我尝试将以下内容放在html框中时，我收到了一堆错误。

No need for the HTML tag, it's already in the output.
No need for the HEAD tag, it's already in the output.
For JavaScript use the panel below or the Resources panel for external files.
For external CSS files use the Resources panel on the left.

我想做的就是在jsfiddle中显示以下内容：

<html>
  <head>
  <title>My Now Amazing Webpage</title>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/jquery.slick/1.5.9/slick.css"/>

<!-- Add the slick-theme.css if you want default styling -->

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/jquery.slick/1.5.9/slick-theme.css"/>


 </head>
  <body>
<div>new1</div>
  <div class="your-class">
    <div>your content</div>
    <div>your content</div>
    <div>your content</div>
  </div>

<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min.js"></script>


  <script type="text/javascript">
    $(document).ready(function(){
      $('.your-class').slick({
        setting-name: setting-value
      });
    });
  </script>

  </body>
</html>

https://jsfiddle.net/benjones337/vnxxdcb7/6/

Answer 1

jsfiddle会自动为您添加头部和身体标签。您需要从HTML中删除它们。对于每个CSS / JS文件，您需要通过外部资源部分添加它。基本上将CSS和JS url一个一个地复制并点击＆＃34; +＆＃34;按钮。另外，请使用带有https的cdnjs等服务来加载您的文件，否则会出现混合内容错误。

<div data-role="page" id="index">
        <div data-role="header">
            <h1>XML Parsing demo</h1>
        </div>        
        <div data-role="content">
            <ul data-role="listview" data-inset="true" id="cars-data">

            </ul>
        </div>       
    </div>
    <div data-role="page" id="cars">
        <div data-role="header">
            <a data-role="button" data-transition="none" data-theme="a" href="#index">Back</a>          
            <h1></h1>
        </div>        
        <div data-role="content">
            <ul data-role="listview" data-inset="true" id="car-data">

            </ul>
            <img src=""width="100%" style="height: auto;" id="car-img"/>
        </div>
    </div>

请参阅我的示例jsfiddle