未捕获类型错误：未定义不是函数-Javascript_Javascript_Jquery_Html

未捕获类型错误：未定义不是函数-Javascript

javascript jquery html

未捕获类型错误：未定义不是函数-Javascript,javascript,jquery,html,Javascript,Jquery,Html,我正在尝试使用JavaScript和jQuery创建一个简单的待办事项列表，其中一个主要功能是能够通过单击事件在任何列表项（挂起或完成）的两种状态之间切换以下是页面的标记： <body> <div id = 'page'> <h2>To Do Items</h2> <form id = 'itemForm'> <input type='text' id='itemD

我正在尝试使用JavaScript和jQuery创建一个简单的待办事项列表，其中一个主要功能是能够通过单击事件在任何列表项（挂起或完成）的两种状态之间切换

以下是页面的标记：

<body>
    <div id = 'page'>
        <h2>To Do Items</h2>
        <form id = 'itemForm'>
            <input type='text' id='itemDesc' placeholder='Add Item' />
            <input type='submit' id = 'addBtn' value ='ADD' />
        </form>
        <ul>
            <li class ='pending'>First item</li>
            <li>Second item</li>
            <li>Third item</li>
        </ul>
    </div>
<script type="text/javascript" src='jquery-1.11.2.js'></script> 
<script type="text/javascript" src='todoScriptjQuery.js'></script>  
</body>


待办事项

第一项
第二项
第三项

下面是添加和切换功能的脚本： $（函数（）{ /添加列表项/ var$newItem=$（“#itemDesc”）； var$itemForm=$（“#itemForm”）； var$itemValue

$itemForm.on('submit', function (e){
    e.preventDefault();
    $itemValue = $('<li class = "pending">');
    $itemValue.append($newItem.val());
    $clear = $('<img class = "icon-invisible">');
    $clear.attr('src', 'Images/png/clear.png');
    $itemValue.append($clear);

    $('ul').prepend($itemValue);
});




/*TOGGLE BETWEEN COMPLETE AND PENDING STATE*/
$('li').on('click', function(e){
    var $target = e.target;
    e.preventDefault();

    switch($target.attr('class')) {
        case 'pending':
            doneItem($target);
            break;
        case 'completed':
            revertItem($target);
            break;
    }
});


function doneItem($target) {
    $target.attr('class', 'completed');
}

function revertItem($target) {
    $target.attr('class', 'pending');
} });

$itemForm.on（'submit'，函数（e）{
e、 预防默认值（）；
$itemValue=$（''）；
$itemValue.append（$newItem.val（））；
$clear=$（'
我遇到的问题是，toggle函数在控制台中记录了一个错误，它说：
Uncaught TypeError:undefined不是switch语句开始行上的函数。我添加了一个条件，只是为了确认jQuery是否正确加载，它是否正确加载。因此，对于下一步要尝试什么，我有点不知所措
任何指针都会有帮助。谢谢。target是DOM元素，不是jQuery对象，因此没有attr（）
方法，因此出现未定义的错误。您需要将其转换为jQuery对象：
var $target = $(e.target);

在将目标对象与.attr（）一起使用之前，需要将其转换为jquery对象
像这样用JQuery包装您的e.target，它应该可以工作
$('li').on('click', function(e){
var $target = $(e.target);
e.preventDefault();

switch($target.attr('class')) {
    case 'pending':
        doneItem($target);
        break;
    case 'completed':
        revertItem($target);
        break;
}
});

谢谢。我没有将事件包装为jQuery对象。它现在可以工作了。没问题，很高兴能提供帮助。
$('li').on('click', function(e){
var $target = $(e.target);
e.preventDefault();

switch($target.attr('class')) {
    case 'pending':
        doneItem($target);
        break;
    case 'completed':
        revertItem($target);
        break;
}
});