ホームページ > 記事 > ウェブフロントエンド > jqueryはrows_jqueryを追加および削除するメソッドを実装します

jqueryはrows_jqueryを追加および削除するメソッドを実装します

WBOYオリジナル: 2016-05-16 16:16:081261ブラウズ

この記事の例では、jquery で行を追加および削除する方法を説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

最近投票管理モジュールを作成し、質問オプションを追加する必要があったので、便宜上、テーブル行の追加と削除を実装しました。

注: jquery.js を導入する必要があります

まずレンダリング: (デフォルトではフォームには 4 行があります)

フォームコード:

コードをコピーコードは次のとおりです:

JS コード:

コードをコピーしますコードは次のとおりです:

var rowCount=4 //デフォルトの行数は 4 行です。

//行を追加 

関数 addRow(){ 

行数 

var newRow='

$('#optionContainer').append(newRow); }

//行を削除
関数 delRow(rowIndex){
$("#option" rowIndex).remove(); 行数--; }

デフォルトで行がある場合は、ID をフォームので定義する必要があることに注意してください。これにより、コードに示すように ID を定期的に定義する必要があります。行を追加するときに新しい行 ID を定義します。
私のフォームにはデフォルトで 4 行（最初の行、つまり id='option0' の行は無視できます）があるため、JS で行数変数を定義する必要があります。そのため、JS で定義された rowCount はデフォルトで 4 になります。 .

はい、完了です。それはとても簡単です。

さらに、指定した位置に行を追加する必要がある場合は、次のように記述する必要があります

コードをコピーします

コードは次のとおりです:$("#tab tr").eq(-2)。 after("

");-2 は、最後から 2 番目の tr の後に行を追加します。

tab はテーブルの ID です

この記事が皆さんの jQuery プログラミングに役立つことを願っています。

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：jQuery_jquery での PushStack の実装原則と応用例次の記事：jQuery_jquery での PushStack の実装原則と応用例

続きを見る

所属问题 (单选) (复选)：	${質問}
选项1：
选项2：
选项3：
选项4：
オプション ' rowCount ':		削除< / a>
キーワード名: < /td>	*

jqueryはrows_jqueryを追加および削除するメソッドを実装します

関連記事