0

私のサイトには、同じ名前のチェックボックスが複数あるフォームがあります。

<span class="selection"><input type="checkbox" name="product" value="Hard Enamel" />Hard Enamel</span>
<span class="selection"><input type="checkbox" name="product" value="Soft Enamel" />Soft Enamel</span>
<span class="selection"><input type="checkbox" name="product" value="Metal Relief" />Metal Relief</span>
<span class="selection"><input type="checkbox" name="product" value="Printed With Epoxy" />Printed With Epoxy</span>

私の Javascript では、これらを変数に割り当て、JQuery を使用して onclick 関数を使用しています。これで、JQuery関数を問題なく実行できます。たとえば、products.css("display","none")動作します。

しかし、その中の特定のチェックボックスを選択しようとするproductsと、エラーが発生します。

これが私のJSです：

var products = $("input[name=product]").click(function(){selectProduct()});

products.get(0).css("display","none");

上記は機能せず、エラーが発生しますbadges_calc.js:9TypeError: 'undefined' is not a function (evaluating 'products.get(0).css("display","none")')

どうすればこれを修正できますか? 私はどちらかというと初心者です。

乾杯

4

4 に答える 4

2

get()eq代わりに使用してみてください。DOM 要素には css メソッドがありません。それは jquery オブジェクトです。eq(0)コレクションの最初の要素を jquery オブジェクトとして提供します。

products.eq(0).css("display","none");

そして、チェックボックスとともにスパンを非表示にしたい場合は、次を使用します。

products.eq(0).closest('span').css("display","none");

それ以外の場合は、チェックボックスを非表示にするだけで、スパンにテキスト自体が残ります。

于 2013-10-09T18:21:08.330 に答える
1

これを試して：

var products = $("input[name=product]");
products.click(function(){selectProduct()});
products.eq(0).css("display","none");

使用.get()すると、生のDOM要素が取得され、jQueryのメソッドを使用できないため、使用できません.css()

于 2013-10-09T18:21:16.333 に答える
1

.get()生の DOM オブジェクトを返します。

.eq(0)要素が 1 つだけの jQuery オブジェクトを返す が必要です。

于 2013-10-09T18:21:18.023 に答える
0

最も近いまたは親を使用して、選択した入力の親を非表示にします。

var products = $("input[name=product]").click(function(){selectProduct(this)});

var items = [];
function selectProduct(self){
    $(self).closest('span').hide('slow');
    items.push($(self).val());
    console.log(items);
}
于 2013-10-09T19:22:14.950 に答える