jquery 動態(tài)增加,減少input表單的簡單方法(必看)
更新時間:2016年10月12日 09:48:18 投稿:jingxian
下面小編就為大家?guī)硪黄猨query 動態(tài)增加,減少input表單的簡單方法(必看)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
html代碼如下
<html> <tr><button style="margin-left:10px" class="add_field_button btn">Add</button></tr> <tbody class="input_fields_wrap"></tbody> </html>
js代碼如下
<script> var max_fields = 5; //maximum input boxes allowed var wrapper = $(".input_fields_wrap"); //Fields wrapper var add_button =(".add_field_button"); //Add button ID var x = 1; //initlal text box count $(add_button).click(function(e){ //on add input button click e.preventDefault(); if(x < max_fields){ //max input box allowed x++; //text box increment $(wrapper).append('<tr style=""><td></td><td><button class="remove_field btn">Del</button></td></tr>'); //add input box } }); $(wrapper).on("click",".remove_field", function(e){ //user click on remove text e.preventDefault(); $(this).closest('tr').remove(); x--; }) </script>
以上就是小編為大家?guī)淼膉query 動態(tài)增加,減少input表單的簡單方法(必看)全部內(nèi)容了,希望大家多多支持腳本之家~
您可能感興趣的文章:
- input 輸入框獲得/失去焦點時隱藏/顯示文字(jquery版)
- jquery顯示隱藏input對象
- jQuery實現(xiàn)表單input中提示文字value隨鼠標焦點移進移出而顯示或隱藏的代碼
- jQuery 隱藏和顯示 input 默認值示例
- jQuery通過改變input的type屬性實現(xiàn)密碼顯示隱藏切換功能
- jquery form 隱藏的input 選擇
- jQuery響應(yīng)鼠標事件并隱藏與顯示input默認值
- jQuery解決input超多的表單提交
- jquery獲取form表單input元素值的簡單實例
- jQuery獲取及設(shè)置表單input各種類型值的方法小結(jié)
- jQuery實現(xiàn)提交表單時不提交隱藏div中input的方法
相關(guān)文章
jQuery中的bind綁定事件與文本框改變事件的臨時解決方法
暫時沒有想到什么好的解決辦法,我現(xiàn)在加了個瀏覽器判斷非ie的話就注冊blur事件,這樣有個問題就是blur實在別的控件活動焦點的時候,txtStation控件注冊的方法是為了填充它緊挨著的一個下拉列表2010-08-08JqueryMobile動態(tài)生成listView并實現(xiàn)刷新的兩種方法
本篇文章主要是對JqueryMobile動態(tài)生成listView并實現(xiàn)刷新的兩種方法進行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2014-03-03jQuery實現(xiàn)信息提示框(帶有圓角框與動畫)效果
這篇文章主要介紹了jQuery實現(xiàn)信息提示框效果,帶有圓角框與動畫功能,點擊上面按鈕實現(xiàn)對應(yīng)文字的漸變顯示效果,非常具有實用價值,需要的朋友可以參考下2015-08-08jQuery實現(xiàn)最簡單的切換圖效果【可兼容IE6、火狐、谷歌、opera等】
這篇文章主要介紹了jQuery實現(xiàn)最簡單的切換圖效果,可兼容IE6、火狐、谷歌、opera等瀏覽器,涉及jQuery結(jié)合時間函數(shù)動態(tài)操作頁面元素的相關(guān)技巧,非常簡單實用,需要的朋友可以參考下2016-09-09