知识大全 jquery动态增加text元素以及删除文本内容实例代码

Posted 2022-07-20 知

篇首语：休言女子非英物，夜夜龙泉壁上鸣。本文由小常识网(cha138.com)小编为大家整理，主要介绍了知识大全 jquery动态增加text元素以及删除文本内容实例代码相关的知识，希望对你有一定的参考价值。

　　这段代码是通过jquery动态增加限定数额的text（本例为个）以及清除文本内容用到了after()方法追加元素 <! 以下为script代码开始 >

复制代码代码如下: <script> $(document) ready(function() var spotMax = ;//限定添加text元素的总个数 var afterId = ;//要追加元素的id var newId= ;//新生成text的id if($( table#vote ) size() >= spotMax) $("#btnAddOption") click(function() afterId++; newId=afterId+ ; addSpot(this spotMax afterId newId); ); ); //添加选项方法 function addSpot(obj sm afterId newId) if($( tr spot ) size() < sm) $( #vote_ +afterId) after( <tr id="vote_ +newId+ " ><th> +afterId+ </th> + <td><input type=text id="txtInput_ +afterId+ " value="" size=" " name=names /></td> + </tr> ); $(":text[id^=txtInput_ ]") val("输入文本 ");//给新增的文本赋予初始值 else alert("最多只能添加项投票！"); ; //重置选项 $("input#btnResetOption") click(function() $(":text[id^=txtInput_ ]") val("");//清空文本内容 ); </script>

　　 <! 以下为script代码结束 > <! 以下为代码块开始 >

复制代码代码如下: <form method= post id="updateForm" action="admin/vote/doVote"> <table cellpadding= cellspacing= width= % > <tr> <th width= >投票名称</th> <td> <input type=text id="txtName" name=name value="" size=" "/> </td> </tr> <tr> <th width= >投票描述</th> <td> <textarea id="txtDescribe" name=remark cols=" " ></textarea> </td> </tr> <tr> <th width= >开始时间</th> <td> <input type=text id="dateMin" value="" name=startDate size=" " readonly="readonly"/> </td> </tr> <tr> <th width= >结束时间</th> <td> <input type=text id="dateMax" name=endDate size=" " readonly="readonly"/> </td> </tr> <tr> <th width= >是否多选</th> <td> <input type=radio id="txtEndTime" name=isSelect value=" " size=" "/>单选 <input type=radio id="txtEndTime" name=isSelect value=" " size=" "/>多选 </td> </tr> <tr id="vote_ "> <th width= >投票选项</th> <td> <input type=button id="btnAddOption" name=btnAddOption value="添加选项"/> <input type=reset id="btnResetOption" name=btnResetOption value="重置选项"/> </td> </tr> <tr id="save"> <th></th> <td align=left> <input type=submit id="btnSave" name=btnSave value="保存"/> <input type=submit id="btnClose" name=btnClose value="取消"/> </td> </tr> </table> </form> cha138/Article/program/Java/JSP/201311/19995