Javascript 事件未在chrome中触发_Javascript_Jquery_Html

Javascript 事件未在chrome中触发

javascript jquery html

Javascript 事件未在chrome中触发,javascript,jquery,html,Javascript,Jquery,Html,我正在尝试复制一些在我的codecademy上有效的东西：然而，当我复制了html、css和js文件并用google chrome运行它时，一切都不起作用。我注意到Jquery缺少链接并添加了它，修复了“添加”功能；然而，“移除部分”从未起作用另外，我通过添加一个触发的警报来确保脚本链接正确以下是html： <!DOCTYPE html> <html> <head> <title>To Do</title>

我正在尝试复制一些在我的codecademy上有效的东西：

然而，当我复制了html、css和js文件并用google chrome运行它时，一切都不起作用。我注意到Jquery缺少

链接并添加了它，修复了“添加”功能；然而，“移除部分”从未起作用

另外，我通过添加一个触发的

警报来确保脚本链接正确
以下是html：
<!DOCTYPE html>
<html>
    <head>
        <title>To Do</title>
        <link rel="stylesheet" type="text/css" href="stylesheet.css"/>
        <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=1.4.2'></script>
        <script type="text/javascript" src="script.js"></script>
    </head>
    <body>
        <h2>Checklist</h2>
        <form name="checkListForm">
            <input type="text" name="checkListItem"/>
        </form>
        <div id="button">Add!</div>
        <br/>
        <div class="list"></div>
    </body>
</html>


做
清单
添加



和jquery（js）文件：
$（文档）.ready（函数（）{
$（“#按钮”）。单击（函数（）{
var toAdd=$（'input[name=checkListItem]'）。val（）；
$（'.list'）.append（''+toAdd+''）；
$（'input[name=checkListItem]'）。val（''；
});
$（document.body）.on（'click'，'item'，函数（事件）{
$（this.remove（）；
});
});
我刚刚发现问题在于使用了旧版本的jQuery。您使用的是1.4.2
，它没有.on（）
函数
<script type='text/javascript' 
        src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=1.4.2'></script>
<!-------------------------------------------------------^^^^^


我刚刚发现问题在于使用了旧版本的jQuery。您使用的是1.4.2
，它没有.on（）
函数
<script type='text/javascript' 
        src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js?ver=1.4.2'></script>
<!-------------------------------------------------------^^^^^


如果使用旧库，请使用.live（）而不是.on（）。希望这对你有用
$(document).ready(function() {
    $('#button').click(function() {
        var toAdd = $('input[name=checkListItem]').val();
        $('.list').append('<div class="item">' + toAdd + '</div>');
        $('input[name=checkListItem]').val('');
    });
    $(".item").live('click', function() {
        $(this).remove();
    });
});

$（文档）.ready（函数（）{
$（“#按钮”）。单击（函数（）{
var toAdd=$（'input[name=checkListItem]'）。val（）；
$（'.list'）.append（''+toAdd+''）；
$（'input[name=checkListItem]'）。val（''；
});
$（“.item”）.live（'click'，function（）{
$（this.remove（）；
});
});

演示：
如果使用旧库，请使用.live（）而不是.on（）。希望这对你有用
$(document).ready(function() {
    $('#button').click(function() {
        var toAdd = $('input[name=checkListItem]').val();
        $('.list').append('<div class="item">' + toAdd + '</div>');
        $('input[name=checkListItem]').val('');
    });
    $(".item").live('click', function() {
        $(this).remove();
    });
});

$（文档）.ready（函数（）{
$（“#按钮”）。单击（函数（）{
var toAdd=$（'input[name=checkListItem]'）。val（）；
$（'.list'）.append（''+toAdd+''）；
$（'input[name=checkListItem]'）。val（''；
});
$（“.item”）.live（'click'，function（）{
$（this.remove（）；
});
});

演示：
那么，IE聪明吗？那么，IE聪明吗？使用最新的jquery版本对学习来说根本不是一个好主意。对于beginer，它应该小于1.6
，1.6或更大
和2.2.4或更小
。不需要使用3.x版本。@HappyCodeing我已经更新了答案。。。我是说只有1.x。。。即使现在我也只使用1.x。如果您是向下投票人，您愿意建议我是否还有其他需要更改的内容吗？@PraveenKumar如果您不想升级库，请使用.bind（）或.live（）而不是.on（），我应该关心投票是向下还是向上？你想用-1来确认是我写的吗？@HappyCoding抱歉。使用最新的jquery版本对学习来说根本不是一个好主意。对于beginer，它应该小于1.6
，1.6或更大
和2.2.4或更小
。不需要使用3.x版本。@HappyCodeing我已经更新了答案。。。我是说只有1.x。。。即使现在我也只使用1.x。如果您是向下投票人，您愿意建议我是否还有其他需要更改的内容吗？@PraveenKumar如果您不想升级库，请使用.bind（）或.live（）而不是.on（），我应该关心投票是向下还是向上？你想用-1来确认是我写的吗？@HappyCoding对不起。