Jquery动态表单不工作_Jquery_Html

Jquery动态表单不工作

jquery html

Jquery动态表单不工作,jquery,html,Jquery,Html,我尝试使用创建Jquery动态，并创建了我的html文件。但它不起作用，这意味着它在单击add按钮时显示html页面，但不显示动态表单。这是我的密码 <html> <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script> jQuery(f

我尝试使用创建Jquery动态，并创建了我的html文件。但它不起作用，这意味着它在单击add按钮时显示html页面，但不显示动态表单。这是我的密码

<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>


jQuery（函数（$）{
var多任务=$（“#多”）；
函数处理程序（e）{
var jqEl=$（e.currentTarget）；
var tag=jqEl.parent（）；
开关（jqEl.attr（“数据操作”））{
案例“添加”：
tag.after（tag.clone（）.find（“input”）.val（“”.end（））；
打破
案例“删除”：
tag.remove（）；
打破
}
返回false；
}
功能保存（e）{
var tags=multitatgs.find（“input.tag”）.map（函数（）{
返回$（this.val（）；
}).get（）.join（'，'）；
警报（标签）；
返回false；
}
多任务。提交（保存）。查找（“a”）。实时（“单击”，处理程序）；
});
形式{
字体系列：helvetica、arial、无衬线字体；
字体大小：11px；
}
表格组{
边缘底部：10px；
}
表格a{
字体大小：12px；
填充：4px10px；
边框：1px实心#4444；
背景：#555555；
颜色：#f7f7f7；
文字装饰：无；
垂直对齐：中间对齐；
}
表格a：悬停{
颜色：#ffffff；
背景:#111111；
}
#多标签{
左边距：20px；
右边距：5px；
字体大小：12px；
背景：#f7f7f7；
填充：4px10px；
边框：1px实心#中交；
垂直对齐：中间对齐；
}
#多输入[type=“text”]{
高度：22px；
左侧填充：10px；
右边填充：10px；
边框：1px实心#中交；
垂直对齐：中间对齐；
}
#多输入[type=“submit”]{
左边距：20px；
边界：无；
背景：#22222；
大纲：无；
颜色：#ffffff；
填充：4px10px；
字体大小：12px；
}
标签

我的代码有什么问题？有人能帮忙解决这个问题吗？

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

您必须更具体，预期结果是什么？单击“添加”按钮时，应添加新记录，这意味着它将重复。请查看我上面的url并进行演示，然后你会得到更清晰的想法。我用fiddle试试你的代码，效果很好，你的问题在哪里？我用firefox浏览器和Crome打开我的html代码，然后单击“添加”按钮。它不会将新字段添加为演示。这就是我的问题所在。你在你的电脑上试过我的代码吗？那些说“不工作”的问题困扰着我。请花点时间构思一个更有意义的标题。谁投票赞成这个问题？