Question

我正在尝试创建一个2checkout立即购买按钮。为了将正确的产品放入购物车，您需要将产品ID传递到URL中。我正在尝试根据用户检查和取消选中复选框的方式构建URL。

例如：

当用户选中复选框时，会使用&product_id=

将URL参数添加到基本网址

$("#buynow").attr('href', function(){
    var baseURL = this.href;
    var newURL = baseURL + '&product_id=' + productID;
    return newURL;
})

用户取消选中该复选框，因此，从URL中删除产品ID：

$("#buynow").attr('href', function(){
    var oldURL = this.href;
    var newURL = oldURL.substr(oldURL.lastIndexOf('&'));
    return url.replace( new RegExp(oldURL), '' );
})

我遇到的问题是我有多个复选框可以添加和删除到URL。

典型的场景：

用户选中复选框A product_id=1，然后选中复选框B product_id1=2。

http://baseurl.com/sid=12345&product_id=1&product_id1=2

用户决定取消选中复选框A.代码会根据'＆amp;'删除lastIndexOf然后删除复选框B产品ID。

如何编写代码，使其不仅删除添加到URL的最后一个参数，而且还根据产品的ID知道要删除的产品。

希望这是有道理的。

Answer 1

以下是根据复选框的名称和值更新href的简单示例。

＆＃13;

$(".url_p").change(function() {
  var href = "http://baseurl.com/";
  $(".url_p").each(function(i) {
    if (!$(this).is(":checked")) return;
    href += (href.indexOf("?")==-1 ? "?" : "&") + this.name + "=" + encodeURIComponent($(this).val());
  });
  console.log(href);
  $("#buynow").attr("href", href);
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' class='url_p' name='product_id' value='100'>Product id
<br/>

<input type='checkbox' class='url_p' name='price' value='80'>Price
<br/>

<input type='checkbox' class='url_p' name='amount' value='1'>Amount
<br/>

<a id='buynow' href='#'>Buy Now</a>

＆＃13;

使用复选框删除lastIndexOf网址

例如：

典型的场景：

1 个答案: