Question

这是index.cshtml文件

@{
        ViewBag.Title = "Vishwaprani Healing Centre";
    }

    <body>
        <div id="wowslider-container1">
            <div class="ws_images">
                <ul>
                    <li><img src="@Url.Content("~/images/slider6.jpg")" alt="slider6" title="slider6" id="wows1_0" /></li>
                    <li><img src="@Url.Content("~/images/slider1.jpg")" alt="slider1" title="slider1" id="wows1_1" /></li>
                    <li><img src="@Url.Content("~/images/slider2.jpg")" alt="slider2" title="slider2" id="wows1_2" /></li>
                    <li><img src="@Url.Content("~/images/slider3.jpg")" alt="slider3" title="slider3" id="wows1_3" /></li>
                    <li><img src="@Url.Content("~/images/slider4.jpg")" alt="slider4" title="slider4" id="wows1_4" /></li>
                    <li><img src="@Url.Content("~/images/slider5.jpg")" alt="slider5" title="slider5" id="wows1_5" /></li>
                    <li><img src="@Url.Content("~/images/slider7.jpg")" alt="slider7" title="slider7" id="wows1_6" /></li>
                    <li><img src="@Url.Content("~/images/slider8.jpg")" alt="slider8" title="slider8" id="wows1_7" /></li>
                    <li><img src="@Url.Content("~/images/slider9.jpg")" alt="jquery photo gallery" title="slider9" id="wows1_8" /></li>
                    <li><img src="@Url.Content("~/images/slider10.jpg")" alt="slider10" title="slider10" id="wows1_9" /></li>
                </ul>
            </div>
            <div class="ws_bullets">
                <div>
                    <a href="#" title="slider6"><span><img src="@Url.Content("~/images/thumb6.jpg")" alt="slider6" />1</span></a>
                    <a href="#" title="slider1"><span><img src="@Url.Content("~/images/thumb1.jpg")" alt="slider1" />2</span></a>
                    <a href="#" title="slider2"><span><img src="@Url.Content("~/images/thumb2.jpg")" alt="slider2" />3</span></a>
                    <a href="#" title="slider3"><span><img src="@Url.Content("~/images/thumb3.jpg")" alt="slider3" />4</span></a>
                    <a href="#" title="slider4"><span><img src="@Url.Content("~/images/thumb4.jpg")" alt="slider4" />5</span></a>
                    <a href="#" title="slider5"><span><img src="@Url.Content("~/images/thumb5.jpg")" alt="slider5" />6</span></a>
                    <a href="#" title="slider7"><span><img src="@Url.Content("~/images/thumb7.jpg")" alt="slider7" />7</span></a>
                    <a href="#" title="slider8"><span><img src="@Url.Content("~/images/thumb8.jpg")" alt="slider8" />8</span></a>
                    <a href="#" title="slider9"><span><img src="@Url.Content("~/images/thumb9.jpg")" alt="slider9" />9</span></a>
                    <a href="#" title="slider10"><span><img src="@Url.Content("~/images/thumb10.jpg")" alt="slider10" />10</span></a>
                </div>
            </div><div class="ws_script" style="position:absolute;left:-99%"><a href="http://wowslider.com">javascript slideshow</a> by WOWSlider.com v8.2</div>
            <div class="ws_shadow"></div>
        </div>
        <script type="text/javascript" src="~/Scripts/script.js"></script>
        <script type="text/javascript" src="~/Scripts/wowslider.js"></script>        
    </body>

这是_Layout.cshtml代码==＆gt;

https://docs.google.com/document/d/1qjQneUBALpjcxghWYEdKnBdnftmBybNA2W5lYqI7y9Q/edit

问题是，当我执行上面的Index.cshtml，其中包含一个带有Visual Studio 2013中给定_Layout.cshtml的Web滑块时，它会给我一个这样的错误。==＆gt; enter image description here 这个图像中提到的功能会导致错误。==＆gt;

$("#wowslider-container1").wowSlider({ effect: "tv,glass_parallax,parallax,brick,collage,seven,kenburns,cube,blur,book,rotate,domino,slices,blast,blinds,basic,basic_linear,fade,fly,flip,page,stack,stack_vertical", prev: "", next: "", duration: 20 * 100, delay: 20 * 100, width: 1024, height: 768, autoPlay: true, autoPlayVideo: false, playPause: true, stopOnHover: false, loop: false, bullets: 1, caption: true, captionEffect: "parallax", controls: true, controlsThumb: false, responsive: 2, fullScreen: false, gestures: 2, onBeforeStep: 0, images: 0 });

这是应该链接到上面代码的.wowSlider方法==＆gt;

https://docs.google.com/document/d/1ZsZp3XEiAKUdMaE5qbcA6idFW6vU66ivdT1wYLQZ_qY/edit

但是当滑块在普通的html文件中执行时，它会毫无问题地执行。 ==＆GT;

enter image description here

在IIS Express服务器中执行代码时是否需要进行任何修改？

Answer 1

所以，问题就像通常那样（脚本的顺序）。

在问题中，wowslider的函数在DOM中有定义之前被调用。

在加载库之后需要调用它。

<强>问题 -

<script type="text/javascript" src="~/Scripts/script.js"></script> //function called before the library loads.
<script type="text/javascript" src="~/Scripts/wowslider.js"></script> //library loaded after

<强>解决方案 -

 <script type="text/javascript" src="~/Scripts/wowslider.js"></script> //library is loaded first
 <script type="text/javascript" src="~/Scripts/script.js"></script>

Answer 2

这是包含正确脚本的问题。如果您这样做，请检查路径。

为什么这个HTML代码会给我一个错误？

2 个答案: