jquery动态表单不起作用

我尝试使用http://jsfiddle.net/pixelentity/aABLD/24/创建jquery动态表单，并创建了我的html文件。但它不起作用，这意味着它显示HTML页面，但点击添加按钮时不显示动态表单。这是我的代码jquery动态表单不起作用

<html> 

<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 

<script> 
jQuery(function($) { 

var multiTags = $("#multi"); 

function handler(e) { 
    var jqEl = $(e.currentTarget); 
    var tag = jqEl.parent(); 
    switch (jqEl.attr("data-action")) { 
    case "add": 
     tag.after(tag.clone().find("input").val("").end()); 
     break; 
    case "delete": 
     tag.remove(); 
     break; 
    } 
    return false; 
} 

function save(e) { 
    var tags = multiTags.find("input.tag").map(function() { 
     return $(this).val(); 
    }).get().join(','); 
    alert(tags); 
    return false; 
} 

multiTags.submit(save).find("a").live("click", handler); 
}); 
</script> 

<style type="text/css"> 

form { 
font-family: helvetica, arial, sans-serif; 
font-size: 11px; 
} 

form div{ 
margin-bottom:10px; 
} 

form a { 
font-size: 12px; 
padding: 4px 10px; 
border: 1px solid #444444; 
background: #555555; 
color:#f7f7f7; 
text-decoration:none; 
vertical-align: middle; 
} 

form a:hover{ 
    color:#ffffff; 
    background:#111111; 
} 

#multi label { 
    margin-left:20px; 
    margin-right:5px; 
    font-size:12px; 
    background:#f7f7f7; 
    padding: 4px 10px; 
    border:1px solid #cccccc; 
    vertical-align: middle; 
    } 

    #multi input[type="text"]{ 
    height:22px; 
    padding-left:10px; 
    padding-right:10px; 
    border:1px solid #cccccc; 
    vertical-align: middle; 
    } 

    #multi input[type="submit"]{ 
    margin-left:20px; 
    border:none; 
    background:#222222; 
    outline:none; 
    color:#ffffff; 
    padding: 4px 10px; 
    font-size:12px; 
    } 


    </style> 

    </head> 



    <body> 


    <form id="multi"> 
    <div> 
    <label>Tag</label><input class="tag" type="text" name="" type="text" /> 
    <a href="#" data-action="add">add</a> 
    <a href="#" data-action="delete">delete</a> 
    </div> 
    <input type="submit" value="save" > 
</form> 
    </body> 
    </html>

` 我的代码有什么问题？有人可以帮助解决这个问题吗？

来源

2013-05-10 Lahiruzz

你必须更具体一点，预期的结果是什么？ – 2013-05-10 07:05:02

点击添加按钮时，它应该添加新记录，这意味着它重复。请看我的上面的网址和做演示，那么你会得到更清晰的想法 – Lahiruzz 2013-05-10 07:09:31

我试着在小提琴中的代码，它工作正常，你的问题在哪里？ – jarvanJiang 2013-05-10 07:12:41

只需将您的jQuery版本更改为更高版本，但不要使用1.9.1或更高版本，因为'live'方法已被删除。或者您可以使用jQuery 1.9将'live'方法更改为'on'方法.1或更高。

来源

2013-05-10 07:47:28 jarvanJiang

谢谢兄弟。 :)现在它工作正常 – Lahiruzz 2013-05-10 08:44:13

jquery动态表单不起作用

回答

相关问题