Question

每个<div>代码都有4个<a>代码和<div>代码。在每个div代码中，我插入了2个span代码和a代码。

点击a代码后，我需要获取产品名称和div的价格

当我使用答案中的代码时，我收到以下警告信息... warning message

Answer 1

试试这个：

$(".get").click(function(e) {
    e.preventDefault();
    var $parent = $(this).closest(".item");
    var itemName = $(".postname", $parent).text();
    var itemPrice = $(".price", $parent).text();

    alert(itemName + " / " + itemPrice);    
});

Example fiddle

请注意，您有许多重复的id属性，这些属性代码无效，会导致您遇到问题。我已将#item元素及其子元素转换为使用类。

Answer 2

的jQuery

$(".get").click(function(event){    

    event.preventDefault(); /*To Prevent the anchors to take the browser to a new URL */

    var item = $(this).parent().find('#postname').text();
    var price = $(this).parent().find('#price').text(); 
    var result = item + " " + price;    
    alert(result)
});

DEMO

关于id的快速说明：

id属性指定HTML元素的唯一ID（该值在HTML文档中必须是唯一的）。

唯一标识符，以便您可以识别元素。您可以将其用作getElementById（）和其他DOM函数的参数，并在样式表中引用该元素。

Answer 3

解决方案如下

使用吹码并试一试

<a data-role="link" href="javascript:linkHandler('<%= obj.productname %>', '<%= obj.price %>')" class="get" >Add <a>



function linkHandler(name, price)
{
    alert(name);
    alert(price);
    var name = name;
    var price = price;
    var cartItem = new item(name, parseFloat(price));
            // check duplicate
            var match = ko.utils.arrayFirst(viewModel.cartItems(), function(item){ return item.name == name; });
            if(match){
                match.qty(match.qty() + 1);
            } else {
              viewModel.cartItems.push(cartItem);
var rowCount = document.getElementById("cartcontent1").getElementsByTagName("TR").length;
document.getElementById("Totala").innerHTML = rowCount;
            }
}

Answer 4

使用jQuery

$('a.get').on('click',function(){
 var parent = $(this).parent(); 
 var name = $(parent+' #postname').text(); 
 var price = $(parent+' #price').text();    
});

Answer 5

或者再次：

$('a').click(function(e){

    e.preventDefault();
    var $price = $(this).siblings('#price').text();
    var $postname = $(this).siblings('#postname').text();
    alert($price);
    alert($postname);

});

Answer 6

尝试

function getPrice(currentClickObject)
{
   var priceSpan = $(currentClickObject).parent("div:first").children("#price");
   alert($(priceSpan).html());
}

并添加到您的代码：

<a href="..." onClick="getPrice(this)">...</a>

Answer 7

如果你的代码中有多个，我建议使用classed而不是id。您正在寻找的功能是兄弟姐妹（）http://api.jquery.com/siblings/

这是你的更新小提琴： http://jsfiddle.net/8VCWU/14/

Answer 8

您好我清理了HTML，因为使用相同的ID不止一次是一个问题。

使用jQuery和我提供的标记解决方案是微不足道的。

在下面的小提琴上记下CSS

http://jsfiddle.net/8VCWU/27/

$(document).ready(function(){
    $("#itmLst a.get").click(function(){
        var $lstItm = $(this).parents("li:first");
        var pName = $lstItm.find("span.postname").html();
        var price = $lstItm.find("span.price").html();

        alert("Product Name: " + pName + " ; Price: " + price);
    });
});

Answer 9

我已经对你的html标签做了一些修改，并用类替换了所有重复的ID，因为你在html中重复了很多id，这会导致麻烦，所以它是错误的结构。在HTML中，您必须为每个标记提供唯一ID。它不会与任何其他标签冲突。

这里我做了完整的垃圾箱演示。我还指定了使用适当的jQuery选择器查找标记内容的所有替代方法。演示链接如下：

演示： http://codebins.com/bin/4ldqp8v

<强>的jQuery

$(function() {
    $("a.get").click(function() {

        var itemName = $(this).parent().find(".postname").text().trim();
        var itemPrice = $(this).parent().find(".price").text().trim();

        //OR another Alternate
        // var itemName=$(this).parents(".item").find(".postname").text().trim();
        // var itemPrice=$(this).parents(".item").find(".price").text().trim();

        //OR another Alternate

        //var itemName=$(this).closest(".item").find(".postname").text().trim();
        //  var itemPrice=$(this).closest(".item").find(".price").text().trim();

        //OR another Alternate

        //var itemName=$(this).siblings(".postname").text().trim();
        //var itemPrice=$(this).siblings(".price").text().trim();
        alert(itemName + " / " + itemPrice);

    });
});

演示： http://codebins.com/bin/4ldqp8v

您可以通过逐个取消评论来检查上述所有备选方案。一切正常。

Javascript获取div信息

9 个答案:

的jQuery

DEMO