未捕获类型错误:undefined不是函数

时间:2014-08-05 10:13:42

标签: javascript html5 telerik

我使用Telerik Appbuilder HTML5 + javascript创建一个简单的表单,它接受用户输入并在单击提交按钮时将其记录到控制台。

ClientClass.js:

function Client() {
    this.username = "username",
    this.password = "Password",
    this.printUsername = function() {
        this.username=$("#Username").val()
        console.log(this.username);
    };
};

Home.html:

<div data-role="view" data-title="Login" data-layout="main" data-model="APP.models.login">
  <script src="../scripts/ClientClass.js"></script>
  <h1 data-bind="html: title"></h1>
    <script src="../scripts/ClientClass.js"></script>
    <script>
        function printUsername() {
            var client = new client();
            client.printUsername();
        }
    </script>
     <ul data-role="listview" data-style="inset">
            <li>
     <label>Username
        <input type="text" value="" id="Username" />
    </label>
                </li>
         <li>
    <label>Password
        <input type="password" value="" />
    </label>
             </li>
         <li>
    <label>
        <button onclick="printUsername()" type="button">Submit</button>
    </label>
             </li>
         </ul>

</div>

的index.html:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
    <link href="styles/main.css" rel="stylesheet" />

    <script src="cordova.js"></script>
    <script src="kendo/js/jquery.min.js"></script>
    <script src="kendo/js/kendo.mobile.min.js"></script>

    <script src="scripts/app.js"></script>
    <script src="scripts/ClientClass.js"></script>

</head>
<body>
    <script src="scripts/ClientClass.js"></script>
    <script src="scripts/ClientClass.js"></script>

    <div data-role="layout" data-id="main">
        <div data-role="header">
            <div data-role="navbar">
                <span data-role="view-title"></span>
            </div>
        </div>

        <!-- application views will be rendered here -->

        <label>
            <input type="password" value="password" />
        </label>

        <div data-role="footer">
            <div data-role="tabstrip">
                <a href="views/home.html" data-icon="home">Home</a>   
                <a href="views/settings.html" data-icon="settings">Settings</a>
                <a href="views/contacts.html" data-icon="settings">Contacts</a>
            </div>
        </div>
    </div>

</body>
</html>

它在控制台中说:

  

未捕获类型错误:undefined不是函数。

然后它说它在index.html#views/home.html:1,当我点击它时,它将我带到调试器的源面板。它说来源是index.html,它说:

(function() {with (this[2]) {with (this[1]) {with (this[0]) {return function(event) {printUsername() }; }}}})

有没有人看到我的HTML或JavaScript有任何问题?或者我导入脚本的方式?感谢

1 个答案:

答案 0 :(得分:1)

您宣称您的客户是一个对象,而不是一个&#34;类&#34;。因此,在对象上使用new并不是很有意义。

所以它取决于你或你保留你的对象并简单地删除:

var client = new client();

或您使用课程

function Client(){}