如何使用jQuery获取特定元素

Question

我有一排里面装有产品的盒子。 它们的名称各不相同，因为所有产品的ID均附有

<div id="plus" name="<?php echo $_item->getId()?>" onclick="greenUp()">+</div>

那是要添加的+号，它将被放置在每个产品的顶部。

var count = 0;
function greenUp() {
    var idProduct = document.getElementById('plus').getAttribute('name');
    if (count == 0) {
        console.log(idProduct);
        jQuery('input[name='+idProduct+']').addClass('selected-plus');
        count = 1;
        console.log(count);
    }
    else {
        jQuery('input[name='+idProduct+']').removeClass('selected-plus');
        count = 0;
        console.log(count);
    }
}

这是我要应用的功能，用于在单击时使每个框变绿，但是，当我单击第一个框时，它起作用，但是，如果单击第二个框，则第一个框将被关闭，就像它们只有一个元素。 任何想法将不胜感激。

编辑：供将来参考以下所有答案对我来说很有意义，我不知道为什么它不起作用。 我要做的就是将id的值直接分配给函数，如下所示：

<label for="related-checkbox<?php echo $_item->getId()?>"><div id="<?php echo $_item->getId()?>" class="plussign" onclick="greenUp(<?php echo $_item->getId()?>)">+</div></label>

并更改功能，如下所示：

        var setup = new Array();
    function greenUp(id) {
        var idProduct = id;
        if (typeof(setup[id]) == 'undefined' || setup[id] == 0) {
                jQuery('#'+idProduct).addClass('selected-plus');
                setup[id] = 1;
            }
        else{
                jQuery('#'+idProduct).removeClass('selected-plus');
                setup[id] = 0;
        }
    }

Answer 1

参考关于问题的评论。 就是这个 ID在页面内也应该是唯一的。 您可以为此使用类。

<div id="plus" name="<?php echo $_item->getId()?>" onclick="greenUp(this)">+</div>

var count = 0;
function greenUp(clickedDiv) {
    var idProduct = clickedDiv.getAttribute('name');
    if (count == 0) {
        console.log(idProduct);
        jQuery('input[name='+idProduct+']').addClass('selected-plus');
        count = 1;
        console.log(count);
    }
    else {
        jQuery('input[name='+idProduct+']').removeClass('selected-plus');
        count = 0;
        console.log(count);
    }
}

使用Jquery Demo： https : //jsfiddle.net/zLwytk9v/3/

Answer 2

<div name="<?php echo $_item->getId()?>" onclick="greenUp()">+</div>

在使用JQ时，请执行以下操作：

var count = 0;
function greenUp() {
    var idProduct = $(this).attr('name');
    if (count == 0) {
        console.log(idProduct);
        jQuery('input[name='+idProduct+']').addClass('selected-plus');
        count = 1;
        console.log(count);
    }
    else {
        jQuery('input[name='+idProduct+']').removeClass('selected-plus');
        count = 0;
        console.log(count);
    }
}