JavaScript中不是函数错误

时间:2013-09-27 13:34:57

标签: javascript error-handling

我是JavaScript的新手,我收到一个错误,我不知道如何修复。我得到了U.$('theForm').onsubmit = setHandlers; is not a function。我知道它可能是愚蠢的。如果有人可以提供帮助,那就太棒了!这是我的代码。

function reportEvent(e) {
    'use strict';
    if (typeof e == 'undefined') e = window.event;
    var target = e.target || e.srcElement;
    var msg = target.nodeName + ': ' + e.type + '\n';
    U.$('output').value += msg;
} // End of reportEvent() function.

function setHandlers(e) {
    'use strict';
    var event = ['mouseover', 'mouseout', 'click', 'keypress', 'blur'];
    for (var i = 0, count = events.length; i < count; i++) {
        var checkbox = U.$(events[i]);
        if (checkbox.checked) {
            U.addEvent(document, events[i], reportEvent);
        }   else {
            U.removeEvent(document, evets[i], reportEvent);
        }
    } // End of FOR loop.    
    U.$('output').value = '';
    return false;
} //End of setHandlers9 function.

window.onload = function() {
    'use strict';
    U.$('theForm').onsubmit = setHandlers;
};

这是我的HTML 这是我的HTML。

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Reporting Events</title>
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="css/form.css">
</head>
<body>
    <!-- Script 8.7 - events.html -->
    <form action="#" method="post" id="theForm">
        <fieldset><legend>Reporting Events</legend>
            <p>Select the events you want to listen for:</p>
            <div><label for="mouseover">mouseover</label><input type="checkbox" name="mouseover" id="mouseover" value="mouseover"></div>
            <div><label for="mouseout">mouseout</label><input type="checkbox" name="mouseout" id="mouseout" value="mouseout"></div>
            <div><label for="click">click</label><input type="checkbox" name="click" id="click" value="click"></div>
            <div><label for="keypress">keypress</label><input type="checkbox" name="keypress" id="keypress" value="keypress"></div>
            <div><label for="blur">blur</label><input type="checkbox" name="blur" id="blur" value="blur"></div>
            <div><input type="submit" value="Submit" id="submit"></div>
            <div><label for="output">Output</label><textarea name="output" id="output" disabled></textarea></div>
        </fieldset>
    </form>
    <script src="js/utilities.js"></script>
    <script src="js/events.js"></script>
</body>
</html>

这是utilities.js

var U = {
$: function(id) {
    'use strict';
    if (typeof id == 'string') {
        return document.getElementById(id);
    }
}, // End of $() function.
setText: function(id, message) {
    'use strict';
    if ( (typeof id == 'string') 
    && (typeof message == 'string') ) {
        var output = this.$(id);
        if (!output) return false;
        if (output.textContent !== undefined) {
            output.textContent = message;
        } else {
            output.innerText = message;
        }
        return true;
    } // End of main IF.
}, // End of setText() function.
addEvent: function(obj, type, fn) {
    'use strict';
    if (obj && obj.addEventListener) {
        obj.addEventListener(type, fn, false);
} else if (obj && obj.attachEvent) {
    obj.attachEvent('on' + type, fn);
    }
}, // End of addEvent() function. 
removeEvent: function(obj, type, fn) {
    'use strict';
    if (obj && obj.removeEventListener) {
        obj.removeEventListener(type, fn, false);
    } else if (obj && obj.detachEvent) {
        obj.detachEvent('on' + type, fn);
    }
} // End of removeEvent() function. 
}; // End of  U declaration.
var U = { /* functions */ }; 

2 个答案:

答案 0 :(得分:2)

删除最后一行的utilities.js

var U = { /* functions */ }; 

它会删除第一个声明,因此所有功能都会消失。

答案 1 :(得分:0)

我不完全确定U是什么,但如果它似乎对你有效,那么问题是你需要使用ID选择器:

U.$('#theForm').onsubmit = setHandlers

此外,请确保您的$('theForm')选择器正确无误。通常,您应该在选择元素$('#theForm')时按ID或更具体的选择器指定,例如<form id="theForm">...</form>