javascript - $(document).ready(...) 没有被调用

标签 javascript node.js ejs express

我有以下ejs模板

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Emasc Editor</title>
        <style>
            .list{
                display: inline-block;
            }
        </style>
        <script type="text/javascript" src="/js/jquery-1.7.1.min.js"></script>
        <script type="text/javscript">
$(document).ready(function(){
    alert('test');
    $("#setMembershipsButton").click(function(e){
        // send selected person and groups to server and create memberships
        data = {
            person: $('#person_list').val(),
            groups: $('#group_list').val()
        };
        $.post('/newConnections', data);
    });
    $("#person_list").change(function(){
        alert('test');
        // send selected person to server and retrieve memberships
        $.post('/getPersonGroups', { personID: $('#person_list').val() }, function(data, textStatus){
            $('#group_list option').removeAttr('selected');
            for(var i=0; i<data.ids.length; i++){
                $('#group_list option[value=' + data.ids[i] + ']').attr('selected', 'selected');
            }
        });
    });
});
        </script>
    </head>
    <body>
        <div class="list">
            <select id="person_list" size="<%= persons.length+1 %>">
                <% for( var i=0; i<persons.length; i++){ %>
                    <option value="<%= persons[i].id %>"><%= persons[i].name %></option>
                <% } %>
            </select>
            <form method="post" action="/newPerson">
                <input type="text" name="user[name]" />
                <input type="submit" value="Submit" />
            </form>
        </div>

        <div class="list">
            <select id="group_list" multiple size="<%= groups.length+1 %>">
                <% for( var i=0; i<groups.length; i++){ %>
                    <option value="<%= groups[i].id %>"><%= groups[i].name %></option>
                <% } %>
            </select>
            <form method="post" action="/newGroup">
                <input type="text" name="group[name]" />
                <input type="submit" value="Submit" />
            </form>
        </div>

        <br/>

        <input id="setMembershipsButton" type="button" value="Set Memberships"></input>
    </body>
</html>

而且第一个 alert('test') 永远不会被调用。 我在这里缺少什么?

最佳答案

您的脚本类型无效:

<script type="text/javscript">

应该是

<script type="text/javascript">

来自 Mozilla :

type
This attribute identifies the scripting language of code embedded within a script element or referenced via the element’s src attribute. This is specified as a MIME type; examples of supported MIME types include text/javascript, text/ecmascript, application/javascript, and application/ecmascript. If this attribute is absent, the script is treated as JavaScript.

但是,如果浏览器无法识别该类型,则该 block 将被忽略。最好完全省略 type 属性以避免输入错误。

关于javascript - $(document).ready(...) 没有被调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8835592/

相关文章:

javascript - js 脚本可以获取在同一文件内的 EJS 上下文/页面中写入的变量吗

jquery - 允许出现在任何地方的 HTML5 元素

javascript - Jquery改变鼠标悬停时div的背景颜色

javascript - 如果 'this' 类为 true,则禁用按钮

javascript - 如何防止javascript一次打开太多文件?

javascript - 循环浏览文件夹 Node.JS 中的文件

node.js - Azure Web应用程序 Node 部署,更改应用程序根目录?

javascript - 如何单击具有特定文本列的表格行的元素?

jquery - 如果函数返回 jQuery AJAX 输出作为返回

javascript - 在 ejs 循环中无法访问某些对象值