ホームページ > ウェブフロントエンド > jsチュートリアル > jquery はテキスト要素を動的に追加し、テキストコンテンツを削除します。 例 code_jquery

jquery はテキスト要素を動的に追加し、テキストコンテンツを削除します。 例 code_jquery

WBOY
リリース: 2016-05-16 17:30:31
オリジナル
983 人が閲覧しました

このコードは、jquery を使用して限られた量のテキスト (この場合は 5 つ) を動的に追加し、要素を追加するために after() メソッドを使用します。

コードをコピーします コードは次のとおりです。以下のように:

<script> <br>$(document).ready(function(){ <br>var SpotMax = 5;//追加されるテキスト要素の総数を制限する <br>var afterId = 0;/ /追加される要素の ID <br>var newId=1;//新しく生成されたテキストの ID <br>if($('table#vote').size() >= SpotMax) {} <br>$( "#btnAddOption").click(function(){ <br>afterId ; <br>newId=afterId 1; <br>addSpot(this, SpotMax,afterId,newId) ; <br>}); <br>}) ; <br>// オプションメソッド<br>function addSpot(obj, sm,afterId,newId) { <br>if($('tr.spot') size() <sm>$ ('#vote_' afterId).after( <br>'<tr id="vote_' newId '" class="spot"><th>' afterId '</th>' <br>'&lt ;td><input type="text" id="txtInput_' afterId '" class="input-text" value="" size="40" name=" names" /></td> ' <br>'</tr>'); <br>$(":text[id^='txtInput_']").val("入力テキスト... ");//新しいテキストに初期化を割り当てます Value<br>} <br>else{ <br>alert("追加できる投票は最大 5 つだけです!"); <br>} <br>}; <br>//オプションをリセット<br>$(" input#btnResetOption").click(function(){ <br>$(":text[id^='txtInput_']").val("");//テキストの内容をクリアします<br>}); <br></script>



コードをコピー コードは次のとおりです。 🎜>
<フォームメソッド='post' id="updateForm" アクション= "admin/vote/doVote">
<テーブル cellpadding=0 cellpacing=0 width="100%" class="table_form">




< ;tr>
投票の説明




開始時刻



終了時間

>

🎜>ラジオ選択
多肢選択



投票オプション



< ;/td>


submit" id="btnClose" name="btnClose" class="button" style="width:50px" value="キャンセル"/>






効果:

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート