jquery click事件 添加html标签后 再次点击无反应

wulinzhijie 2015-06-08 08:16:35
想做一个追加input框的功能,代码如下

html代码:
<div class='xhdz'><input type='text' name='xhmc[]' style='width:100px;margin-right:10px;' value='' /><input type='text' name='xhdz[]' class='intxt' value='' /><a href='javascript:void(0)' id='addone'>添加一条</a></div>

js代码:
$(document).ready(function(){
$('#addone').on('click', function(){
var str = "<div class='xhdz'><input type='text' name='xhmc[]' style='width:100px;margin-right:10px;' value='' /><input type='text' name='xhdz[]' class='intxt' value='' /><a href='javascript:void(0)' id='addone'>添加一条</a><a href='javascript:void(0)' class='delone''>删除</a></div>";
$(this).parent().after(str);

$('.delone').click(function(){
$(this).parent().remove();
});
});
});

点击html代码部分的“添加一条”可以添加,但是jquery追加的部分再次点击“添加一条” 就没办法添加了,求大神指点
...全文
610 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
Braska 2015-06-09
  • 打赏
  • 举报
回复
id不要重复

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.8.3/jquery.min.js"></script>
<style type="text/css">
</style>
<script>
$(document).ready(function(){
$(document).on('click','.addone', function(){
var str = "<div class='xhdz'><input type='text' name='xhmc[]' style='width:100px;margin-right:10px;' value='' /><input type='text' name='xhdz[]' class='intxt' value='' /><a href='javascript:void(0)' class='addone'>添加一条</a><a href='javascript:void(0)' class='delone''>删除</a></div>";
$(this).parent().after(str);

$('.delone').click(function(){
$(this).parent().remove();
});
});
});	
</script>
</head>
<body>
<div class='xhdz'><input type='text' name='xhmc[]' style='width:100px;margin-right:10px;' value='' /><input type='text' name='xhdz[]' class='intxt' value='' /><a href='javascript:void(0)' class='addone'>添加一条</a></div>
</body>
</html>
scscms太阳光 2015-06-09
  • 打赏
  • 举报
回复
$('.delone').on("click",function(){ $(this).parent().remove(); });
遥望那些年 2015-06-08
  • 打赏
  • 举报
回复

<!DOCTYPE html>
<script src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superplus/js/lib/jquery-1.10.2_d88366fd.js"></script>
<script>
    $(document).ready(function () {
        var addoneAction = function () {
            var str = "<div class='xhdz'><input type='text' name='xhmc[]' style='width:100px;margin-right:10px;' value='' /><input type='text' name='xhdz[]' class='intxt' value='' /><a href='javascript:void(0)' class='addone'>添加一条</a><a href='javascript:void(0)' class='delone''>删除</a></div>";
            $(this).parent().after(str);
            $('.addone').unbind('click').bind('click', addoneAction);
            $('.delone').unbind('click').bind('click', deloneAction);
        };

        var deloneAction = function () {
            $(this).parent().remove();
        };

        $('.addone').unbind('click').bind('click', addoneAction);
    });	
</script>
<html lang="en">
<head>
    <title>HTML</title>
</head>
<body>
    <div class='xhdz'>
        <input type='text' name='xhmc[]' style='width: 100px; margin-right: 10px;' value='' /><input
            type='text' name='xhdz[]' class='intxt' value='' /><a href='javascript:void(0)' class='addone'>添加一条</a></div>
</body>
</html>

87,996

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧