Javascript 通过使用jQuery单击div替换onclick特定参数

我正在构建定制购物车，在这里，我使用jQuery onclick在弹出模型的同一页面上显示产品详细信息，但在弹出窗口中，我还想在onclick的第一个参数中的“添加到购物车”按钮上更新产品ID，下面是演示代码：

产品缩略图：

<div id="product">
    <img src="http://placehold.it/250x150" />
    <input type="hidden" value="159" />
</div>

弹出“添加到购物车”按钮

<a href="#" onclick="add_to_cart('Product_ID', 'Product_Price');">Add to Cart</a>

---

我想要的是，当我点击product

时，隐藏输入中的值也会在Add to Cart按钮上更新，第一个参数是onclick attr，即product\u ID，关于这一点的任何帮助都会非常明显。

要“快速修复”此代码，您可以使用如下内容：

小提琴HTML

<div id="product">
    <img src="http://placehold.it/250x150" />
    <input type="hidden" value="159" />
</div>
<br>
<br>
<a href="#" id="add" data-product="10" data-price="9.95">Add to Cart btn in popup</a>

演示

Jquery

       $(document).ready(function(){
var ProductID = $('div').find('#ProductID').attr('value');
    var Price = $('div').find('#price').attr('value');

$('div').click(function (event) {
    event.preventDefault();
    $('a').attr('onclick', function (i, v) {
        v=v.replace('Product ID',ProductID);
        return v.replace('Product Price',Price);
    });
});

    });

function add_to_cart(productid,price)
{
    alert(productid+"/"+price);
}

---

我希望这就是您所需要的

我正试图在下面的fiddle链接中解决这个问题，只是要注意，您上面的示例中没有包含Jquery的任何片段。这都是纯JavaScript。另一个问题，如果参数的值是动态的，我的意思是我们已经通过匹配值字符串替换了“Product Price”的值，因此会出现一些随机值而不是“Product Price”！那么，我们如何只更新特定的（第一个或第二个）参数呢。

       $(document).ready(function(){
var ProductID = $('div').find('#ProductID').attr('value');
    var Price = $('div').find('#price').attr('value');

$('div').click(function (event) {
    event.preventDefault();
    $('a').attr('onclick', function (i, v) {
        v=v.replace('Product ID',ProductID);
        return v.replace('Product Price',Price);
    });
});

    });

function add_to_cart(productid,price)
{
    alert(productid+"/"+price);
}