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()返回 DOM 元素尝试使用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),它返回一个只有一个元素的 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 回答