Typed.js未在ASP.NET中加载

Question

I've made a function for my index.cshtml and written that in index.js, this file uses the Typed.js library, but it doesn't find it. 我为index.cshtml创建了一个函数，并在index.js中编写了该函数，该文件使用Typed.js库，但找不到它。 I included both typed.js and typed.min.js. 我同时包括typed.js和typed.min.js。 Should I link the scripts instead of the _layout file in the index.cshtml? 我应该链接脚本而不是index.cshtml中的_layout文件吗？

This is my _layout.cshtml: 这是我的_layout.cshtml：

 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>@ViewBag.Title - My ASP.NET Application</title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="~/Scripts/typed.min.js"></script> <script src="~/Scripts/index.js" type="text/javascript"></script> @Styles.Render("~/Content/css") @Scripts.Render("~/bundles/modernizr") </head> <body> <div class="container body-content"> @RenderBody() <hr /> <footer> <img src="~/Content/images/atoslogo.png" class="img-responsive" style="height: 100px" /> </footer> </div> @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/bootstrap") <script src="~/signalr/hubs"></script> @RenderSection("scripts", required: false) </body> </html>

The function itself (index.js) : 函数本身（index.js）：

 function typerJS() { if (counter == 0) { setTimeout(function () { $(".element0").typed({ strings: ["Wachten op de eerste sensordata... (0/3)"], typeSpeed: 30, // typing speed backDelay: 750, // pause before backspacing loop: false, // loop on or off (true or false) loopCount: false, // number of loops, false = infinite callback: function () { } // call function after typing is done }); }, 0); } if (counter == 1) { setTimeout(function () { $(".element1").css("display", "inherit"); $(".element1").typed({ strings: ["Wachten op de eerste sensordata...(1/3)"], typeSpeed: 30, // typing speed backDelay: 750, // pause before backspacing loop: false, // loop on or off (true or false) loopCount: false, // number of loops, false = infinite callback: function () { } // call function after typing is done }); }, 2000); } if (counter == 2) { setTimeout(function () { $(".element2").css("display", "inherit"); $(".element2").typed({ strings: ["Wachten op de eerste sensordata... (2/3)"], typeSpeed: 30, // typing speed backDelay: 750, // pause before backspacing loop: false, // loop on or off (true or false) loopCount: false, // number of loops, false = infinite callback: function () { } // call function after typing is done }); }, 4000); } if (counter == 3) { setTimeout(function () { $(".element3").css("display", "inherit"); $(".element3").typed({ strings: ["Wachten op de eerste sensordata...(3/3)"], typeSpeed: 30, // typing speed backDelay: 750, // pause before backspacing loop: false, // loop on or off (true or false) loopCount: false, // number of loops, false = infinite callback: function () { } // call function after typing is done }); }, 6000); } if (counter == 3) { setTimeout(function () { $(".element4").css("display", "inherit"); $(".element4").typed({ strings: ["U wordt zo spoedig mogelijk doorgestuurd.."], typeSpeed: 30, // typing speed backDelay: 750, // pause before backspacing loop: false, // loop on or off (true or false) loopCount: false, // number of loops, false = infinite callback: function () { } // call function after typing is done }); }, 6000); } }

The error I get: 我得到的错误：

Anybody knows what i'm doing wrong? 有人知道我在做什么错吗？ Thanks in advance!! 提前致谢！！

Answer 1

Now I've looked up Typed.js and just looked at the documentation. 现在，我查找了Typed.js并查看了文档。 This took me less then a minute. 这花了我不到一分钟的时间。

You're problem is, that you want to use Typed.js and you used jQuery . 您的问题是，您要使用Typed.js和jQuery 。

A sample setup of Typed.js looks like this: Typed.js的示例设置如下所示：

var typed = new Typed('.element', {
    strings: [
        "First sentence.",
        "Second sentence."
    ],
    typeSpeed: 30
});

So you just have to simply look at the manual and then use it correctly. 因此，您只需要简单地阅读手册，然后正确使用它即可。

For you this means: 对您来说，这意味着：

Just use the code you already have and then use new Typed("x", ...) instead of $("x").typed(...) . 只需使用已有的代码，然后使用new Typed("x", ...)代替$("x").typed(...) 。

new Typed("element0", {
    strings: ["Wachten op de eerste sensordata... (0/3)"], 
    typeSpeed: 30, // typing speed
    backDelay: 750, // pause before backspacing
    loop: false, // loop on or off (true or false)
    loopCount: false, // number of loops, false = infinite
    callback: function () { } // call function after typing is done
});

Answer 2

use this cdn's 使用此CDN

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/typed.js/1.1.4/typed.min.js"></script>

and use an external script of: 并使用以下外部脚本：

     $(document).ready(function(){
     $("#hero").typed({
                strings: [val.quote],
                typeSpeed: 110, // typing speed
                backDelay: 500, // pause before backspacing
                loop: trueenter code here
            });
});

Typed.js未在ASP.NET中加载

问题描述

2 个解决方案

解决方案1
0 2017-09-21 10:39:23

解决方案2
0 2018-11-11 08:27:29

Typed.js未在ASP.NET中加载

问题描述

2 个解决方案

解决方案1 0 2017-09-21 10:39:23

解决方案2 0 2018-11-11 08:27:29

解决方案1
0 2017-09-21 10:39:23

解决方案2
0 2018-11-11 08:27:29