jQuery 代码被忽略

jQuery code ignored

我在单独的脚本中有以下代码:

$(document).ready(function() {
    $('body').css('background-color', "#" + getRandomInt(10, 99) + getRandomInt(0, 99) + getRandomInt(0, 99));
    $('span').click(function(e) {
        for(var i = 0; i < 100000; i++) {
            console.log('TESEEEEEEEEEEEEEEET');
        }
        var clicked_button = $(e.target);
        add_post_part(clicked_button);
    });
});

function add_post_part(clicked_button) {
    var number_of_post_parts = $('#content .post-part').length;


}

/**
 * Returns a random integer between min (inclusive) and max (inclusive)
 * Using Math.round() will give you a non-uniform distribution!
 */
function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

这是HTML代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />

        <!-- basic stylesheet -->
        <link rel="stylesheet" type="text/css" href="static/css/general.css">

        <!-- jQuery -->
        <script language="text/javascript" src="http://code.jquery.com/jquery-2.1.3.js"></script>

        <!-- my own scripts -->
        <script language="text/javascript" src="static/js/post_parts.js"></script>

        <title>Blog Post</title>
    </head>
    <body>
        <div id="content">
            <span>Title:</span><br>
            <textarea class="post-part post-title" id="post_part_0"></textarea><br>
            <input class="add-post-part-button" type="button" value="add part"/>
            <input class="remove-post-part-button" type="button" value="remove part"/><br><br>

            <span>Text:</span><br>
            <textarea class="post-part post-text" id="post_part_1"></textarea><br>
            <input class="add-post-part-button" type="button" value="add part"/>
            <input class="remove-post-part-button" type="button" value="remove part"/><br><br>  
        </div>
    </body>
</html>

当我在 html 页面的源代码视图中单击我自己的脚本名称时,它正确地显示了该脚本,因此浏览器(尝试使用 FF、OP、Chromium)找到了它,但是,无论我做什么,代码永远不会 运行.

当我单击页面上的任何 span 元素时,我预计它会 运行。此外,我已经尝试在文档准备好后插入一个简单的 console.log(""),但也从未执行过。

我的代码有什么问题?是不是我的浏览器突然失去了 运行 本地 js 文件的能力?

几个小时以来,我一直在尝试让我的浏览器记录一个简单的输出,但似乎没有什么可以解决的。开始怀疑我是不是代码盲还是什么。

编辑#1: 重新加载页面时我的控制台输出: GET http://localhost:5000/makepost [HTTP/1.0 200 OK 2ms] GET http://localhost:5000/static/css/general.css [HTTP/1.0 304 NOT MODIFIED 3ms] GET http://code.jquery.com/jquery-2.1.3.js [HTTP/1.1 304 Not Modified 37ms] GET http://localhost:5000/static/js/post_parts.js [HTTP/1.0 304 NOT MODIFIED 2ms] JavaScript 1.6's for-each-in loops are deprecated; consider using ES6 for-of instead ScriptSurrogate.js:344:209 GET http://localhost:5000/static/img/bg/footer_lodyas.png [HTTP/1.0 304 NOT MODIFIED 2ms]

编辑#2: 在此处的答案之一中找到了解决方案:它必须是 <script *type*="..." src="..."></script> 并不是 <script *language*="..." src="..."></script>

显然,当它用于其他用途时,我的脑海中仍然保留着该语言属性。

我认为它可以 运行,但是控制台记录 10k 次所以它会暂时锁定浏览器。 运行 这个,点击标题你会看到我添加的提醒。我注释掉循环迭代 10k 次。

$(document).ready(function() {
    $('body').css('background-color', "#" + getRandomInt(10, 99) + getRandomInt(0, 99) + getRandomInt(0, 99));
    $('span').click(function(e) {
        //for(var i = 0; i < 100000; i++) {
        alert('TESEEEEEEEEEEEEEEET');
        //}
        var clicked_button = $(e.target);
        add_post_part(clicked_button);
    });
});

function add_post_part(clicked_button) {
    var number_of_post_parts = $('#content .post-part').length;


}

/**
 * Returns a random integer between min (inclusive) and max (inclusive)
 * Using Math.round() will give you a non-uniform distribution!
 */
function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<head>
        <meta charset="utf-8" />

        <title>Blog Post</title>
    </head>
    <body>
        <div id="content">
            <span>Title:</span><br>
            <textarea class="post-part post-title" id="post_part_0"></textarea><br>
            <input class="add-post-part-button" type="button" value="add part"/>
            <input class="remove-post-part-button" type="button" value="remove part"/><br><br>

            <span>Text:</span><br>
            <textarea class="post-part post-text" id="post_part_1"></textarea><br>
            <input class="add-post-part-button" type="button" value="add part"/>
            <input class="remove-post-part-button" type="button" value="remove part"/><br><br>  
        </div>
    </body>

我改了:

 <script language="text/javascript" src="http://code.jquery.com/jquery-2.1.3.js"></script>

收件人:

<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.3.js"></script>

它对我有用。