时间戳

首页 > 解决方案 > 从 HREF 获取 .load 的 URL

jquery - 从 HREF 获取 .load 的 URL

问题描述

在另一个页面（博客等）中列出产品时，寻找一种从另一个页面获取产品价格的方法

我让它与下面的 Jquery 一起工作：

$(document).ready(function(){
    $.ajax({ url: "product-url1",
     context: document.body,
     success: function(){
      $("#priceDisplay1").load("product-url1 .price");
    }});
});

但是，如果我要显示超过 1 个产品，我想尝试节省一些时间为每个产品重写代码

IE

<a href="product-url1"><p>Product Title 1</p></a>
<div id="priceDisplay1"></div>

<a href="product-url2"><p>Product Title 2</p></a>
<div id="priceDisplay2"></div>

<a href="product-url3"><p>Product Title 3</p></a>
<div id="priceDisplay3"></div>

我想要实现的是它可以通过并获取每个 href 并运行该功能

标签： jqueryajax

解决方案

首先，您应该识别所有对<a>和<div>：

<a href="product-url1" class="iAmAPriceAnchor" data-my-display="priceDisplay1">
    <p>Product Title 1</p>
</a>
<div id="priceDisplay1"></div>

<a href="product-url2" class="iAmAPriceAnchor" data-my-display="priceDisplay2">
    <p>Product Title 2</p>
</a>
<div id="priceDisplay2"></div>

<a href="product-url3" class="iAmAPriceAnchor" data-my-display="priceDisplay3">
    <p>Product Title 3</p>
</a>
<div id="priceDisplay3"></div>

一旦确定了所有对，您就可以遍历它们并执行您的操作：

$(document).ready(function(){
    $('.iAmAPriceAnchor').each(function(){
        var priceUrl = $(this).attr('href');
        var myDisplayId = '#' + $(this).data('my-display');
        $.ajax({ 
            url: priceUrl,
            context: document.body,
            success: function(){
                $(myDisplayId).load(priceUrl + " .price");
            }
        });
    });
});

希望能帮助到你

推荐阅读