本文实例讲述了Jquery动态添加输入框的方法。分享给大家供大家参考。具体实现方法如下：

！-页头-#包括'./普通/头像。ftl ' div id=' on failure div ' class=' alert alert-danger nav bar-fixed-top ' style=' text-align : center；display : none/div div class=' container ' style=' min-height :100%；高度：100%;'页边距-顶部：100像素；form id=' address form ' class=' form-horizontal '方法=' post ' action='/restaurant/$ {(user。userid)}/addaddaddaddaddaddress ' div class=' form-group dynamic-collection ' id=' course-goals-form-group ' div class=' col-MD-2 control-label '地址/label/div class=' col-MD-8 controls ' ul id=' ItemCourseList ' class=' list-group可排序-list ' data-role=' list ' style=' margin-bottom :10 px；/ul div class=' input-group ' input id=' course input ' type=' text ' data-role=' item-input ' class=' form-control ' span class=' input-group-BTN '按钮id=' additem course ' class=' BTN BTN-default ' type=' button ' data-role=' item-add '添加/button/span/div/div/form！-container-/div脚本类型=' text/JavaScript ' src=' http : $ { app。BasePath }/resources/js/jquery。形式。js '/script script $ .schoolFn={ addCourseItem:函数(obj){ $('#ItemCourseList ').追加(' Li class=' list-group-item clear fix ' span class=' glyphicon-glyphicon-resize-垂直排序-handle '/span ' obj ' input type=' hidden ' name=' goals ' value=' obj ' ' button type=' button ' class=' close delete-BTN deleteItem ' onclick=' deletecoursitem(this)；标题='删除/按钮/Li’；}，addItem:函数(obj){ $('#itemList ').追加(' Li class=' list-group-item clear fix ' span class=' glyphicon glyphicon-resize-垂直排序-手柄'/span' obj '输入类型=' hidden ' name=' accessors ' value=' obj ' ' button type=' button ' class=' close delete-BTN deleteItem ' onclick=' deleteItem(this)；'标题='删除/按钮/Li’；}，} $(' #additem折痕').单击(函数(){ var item=$(' #课程输入')).val()；if(项目。trim()==' '){ $(' #课程输入').val(" ")；} else { $。学校fn。addcourseItem(项目)；$('#courseInput ').val(" ")；} });函数deleteCourseItem(obj){ $(obj).父项()。替换为(" ")；} /script script $(文档)。ready(function(){ $(' # address form ')).Ajax表单(函数)(JSON){ if(JSON。status==' success '){ $(' # on failure div ').html(")添加成功').向下滑动()。延迟(3000)。隐藏(1000);}else { $('#onFailureDiv ').html(json.errorMsg).向下滑动()。延迟(3000)。隐藏(1000);} });});/脚本！-页脚-#包括'./common/footer.ftl'/效果图如下：

希望本文所述对大家的jQuery程序设计有所帮助。