javascript - MVC 忽略了我的 Javascript 文件。

Question

不久前，我创建了一个 MVC 应用程序，然后我才真正理解 MVC 是后端而不是前端(例如，我不完全确定我的自定义 html 适合哪里)。所以我创建了一个网站，它只是一个 HTML 页面、一个 CSS 文件和一个 Javascript 文件。它运行得非常好，所以我返回到我的 MVC 应用程序，将我创建的内容映射到它上面，这样我就可以从后端提供信息，而不是让我的 html 被信息段落弄乱。我将 JS 文件放在 Scripts 文件夹中，并将其包含在我的 index.cshtml 中。

经过调试，发现不是JS不行，根本就没有包含在元素中。这在 Firefox Developer Edition 和 Internet Explorer 中都是如此。

我尝试在 reference.js 中添加对它的引用。我尝试创建一个 .DLL 并将其调用到我的页面中。我已经尝试删除所有其他 Javascript 文件以确保它没有被覆盖，只是最终得到一个根本没有 javascript 的页面。我什至尝试重新创建元素，但仍然没有用。我尝试将我的 js 文件移动到顶部，以防它与加载顺序有关。我尝试了其他一些东西，但在三天的搜索过程中几乎没有任何进展，我记不起它们到底是什么了。我唯一没有做的就是将脚本本身直接放在页面中。

我正在使用 Windows 10，尝试在 VisualStudio 2015 中开发并回滚到 2013 年，部分原因是无法更改我的高级属性以在 2015 年将 JS 内容设置为嵌入(另一个建议)。元素的各个部分是最初是在 Windows8.1 上的 VS2013 中完成的，所以我想知道是否存在某种我忽略的兼容性问题。

我不确定在这里提供什么代码，但这是我当前的 html:

对红狼的恳求

<!--Styles-->
<link rel="stylesheet" type="text/css" href="Site.css">
<link href='http://fonts.googleapis.com/css?family=Yesteryear' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<!--Scripts-->
<script src="~/Scripts/animalpagination.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

这是我的 JS。它采用四个按钮的分页样式元素，以网页上的信息为目标，并在按钮状态处于事件状态时显示它。

//assign button a value, remove active, add active to clicked

$('.animalbutton').on('click', function () {
    var animaltoShow = $(this).attr('rel');
    $('#' + animaltoShow).button();
    $('.animalbutton').removeClass('active');
    $(this).addClass('active');

    //change active class on the content

    $('.animal').removeClass('active');
    $(this).show(function () {
        $("#" + animaltoShow).addClass('active', isactive);
    })

    function isactive() {
        //check if active, toggle visibility
        if (!'.animal .active') {
            document.getElementByClass('.animal').style.visibility = 'hidden';
        }
        else {
            document.getElementByClass('.animal .active').style.visibility = 'visible';
        }
    }

})

我是一名开发新手，所以我的代码中可能存在问题。现在，我主要专注于将该文件包含在浏览器中，但随时欢迎提出建议。

Answer 1

您是否尝试过在您的代码之前包含 JQuery？由于您在其中使用了 JQuery，因此必须在 ...

此外，您可以尝试使用一些:

console.log('everything is fine here');

检查您的代码是否在每一步都正常工作。祝你好运!