Jquery-在共享相同类名的其他元素之间选择一个元素(单击时）

Jquery - Select one element (on click) between other elements that share the same class name

本文关键字：元素 一个 单击 共享 选择 同类 其他 之间 Jquery-      更新时间：2023-09-26

我正在想办法。我正在为我的学校项目做一个电子商店。我几乎完成了所有的脚本编写，但这一次让我很烦恼。

我有一个所有项目的类，这意味着从1到10的项目都有相同的类名。当我想添加到购物车时，我点击就会有一个$.帖子在后面做所有的魔术。问题是，它只选择具有该类名的第一个元素。我在网上搜索过，只找到了"选择所有具有相同类名的元素"或"选择父元素中的元素"。我希望它选择共享相同类名的单个元素
我会把代码贴在这里，谢谢：）

$(".adicionar_ao_carrinho").bind("click",function(){
    $(this).each(function(){
    var a =  $("[name='item']").val(); //debugg purpose
    alert(a); //debugg purpose
        $.post("ajax/carrinho.php",
        {
            id: $("[name='item']").val(),
            preco: $("[name='preco']").val(),
            qtd: $("[name='quantidade']").val(),
            user: <?php echo $_SESSION['uid']; ?>
        },function(data){
                alert(data);
            }
        )
    });
});

编辑：

<div class='"adicionar_artigo'">
    <form method='post'>
        <input type='text' name='quantidade' size='1' value='1'/>
        <a href='"#'" name='"trigger'" class='"adicionar_ao_carrinho'"><img src='"ficheiros/images/icons/adicionar_1.png'" /></a>
        <input type='hidden' name='item' value='$id_artigo' />
        <input type='hidden' name='preco' value='$preco' />
    </form>
</div>

每个项目都有一个像这样的表格。

第2版：http://s14.postimg.org/w29v5x2fl/error.png
这就解释了更好的

我猜一下，你的代码第一次点击就失败了，因为这是：

user: <?php echo $_SESSION['uid']; ?>

输出一个未加引号的字符串，并且应该是：

user: "<?php echo $_SESSION['uid']; ?>"

这会给你留下：

$(".adicionar_ao_carrinho").on("click",function(){
    var form = $(this).closest('form'),
        data = {
        id   : $("[name='item']", form).val(),
        preco: $("[name='preco']", form).val(),
        qtd  : $("[name='quantidade']", form).val(),
        user : "<?php echo $_SESSION['uid']; ?>"
    }    
    $.post("ajax/carrinho.php", data ,function(result){
        console.log(result);
    }).fail(function(a,b,c) {
        console.log('ajax failed');
    });
});

完成。更改的html:

<div class='"adicionar_artigo'">
    <a href='"#'" class='"adicionar_ao_carrinho'">
        <img src='"ficheiros/images/icons/adicionar_1.png'" />
    </a>
    <input type='hidden' name='preco' value='$preco' />
    <input type='hidden' name='item' value='$artigo[ID_artigo]' />
    <input type='text' name='quantidade' size='1' value='1'/>
</div>

还更改了jquery：

$(".adicionar_ao_carrinho").bind("click",function(){
    var parent = $(this).parent();
    $.post("ajax/carrinho.php",
    {
        id: $("input[name='item']",parent).val(),
        preco: $("input[name='preco']",parent).val(),
        qtd: $("input[name='quantidade']",parent).val(),
        user: "<?php echo $_SESSION['uid']; ?>"
    },function(data){
            alert(data);
        }
    )
});

它正在发挥作用。感谢大家的帮助和努力！：）

试试这个：

$(".class_name")

说明：

代码中的点指定现在我们谈论的是类，然后class_name当然是其他元素共享的类名。就像在你的情况下，class_name是adicionar_ao_carrinho，所以上面的代码将改为这个：$("a.adicionar_ao_carrinho");

更具体地说，如果它是div或span或其他任何东西，您可以像这样更改上面的内容：

用于div：$("div.class_name");对于跨度：$("span.class_name");

说明：

这适用于所有其他元素。但是，如果该类仅用于单个元素，则上述方法也同样有效，但如果不同的元素使用相同的元素，则可能需要第二个。

更新：看了你的HTML后，我发现你的类名和你说的不一样！所以应该是这样的：$("div.adicionar_artigo");

相关文章：