5

、、、および要素をでラップして<label>、直接編集できないフォームの位置を修正しようとしています。何らかの理由で、次のコードを使用しようとすると、次のようになります。<input type="text" /><select><div class="formItem"></div>

$("label").before("<div class=\"formItem\">");
$("input[type=text]").after("</div>");
$("select").after("</div>");

動作しません。それは私を助けない<div class="formItem"></div>すべての前に追加するだけです。<label>

私は見てきました.wrap();が、私がやろうとしているように、それを使用して複数の要素をラップする方法が明確ではありません。HTMLマークアップの例を次に示します。

<label>Text Box</label>
<input type="text" name="Text Box" />

<label>Select Menu</label>
<select name="Select Menu">
    <option>Example</option>
</select>

約10セット、9つのテキストボックス、およびそれが重要な場合は1つの選択ボックスがあります。

4

3 に答える 3

7

これは、jQueryAPIの動作方法ではありません。まったく。

.before()：

一致した要素のセット内の各要素の前に、パラメーターで指定されたコンテンツを挿入します。

.after()：

一致した要素のセット内の各要素の後に、パラメーターで指定されたコンテンツを挿入します。

オープンタグとクローズタグの観点から考えないでください。実際の要素の観点から考えてください。

あなたはおそらく探してい.wrapAll()ます。

$('label').each(function () {
    $(this).next('input, select').andSelf().wrapAll('<div class="formItem"/>');
});
于 2013-03-18T21:16:24.203 に答える
1

jquery では、完全な要素しか追加できません。つまり、終了タグを含める必要があります。これは、実際に行っているのは を呼び出しているためですdocument.createElement('div')。したがって、この問題を解決するには、元のコードにできるだけ近づけて、次を使用します。

var newEl = $("select").after("<div class=\"formItem\"></div>");
$("input[type=text]").appendTo(newEl);
$("select").appendTo(newEl);
于 2013-03-18T21:18:22.923 に答える
1

これを試して：

$('label').next().andSelf().wrap("<div class=\"formItem\">");

label 要素とそれに続く兄弟要素を div.formItem で囲みます。

于 2013-03-18T21:18:43.353 に答える