jquery - 将输入中的数字附加到href

Question

我正在尝试将输入字段中的数字附加到链接中的 URL。

我目前的代码是替换整个 URL，而不是添加到它的末尾：

<input id='customquantity' type='number'></input>
<a href="/product/?add-to-cart=46551" id='url'>Add To Basket</a>

<script>
  jQuery(function(){
    jQuery('#customquantity').keyup(function(){
      var quantity = jQuery('#customquantity').val();
      jQuery('#url').attr('href', '&quantity= ' + quantity);
    });
  });
</script>

如果有人输入'3'输入，则href变为：

href="&quantity=3"

代替：

href="/product/?add-to-cart=46551&quantity=3"

有人可以解释我哪里出错了吗？

标签： jqueryhtml

Answer 1

您需要获取原始值并将更改附加到末尾：

  jQuery(function(){
    let url = jQuery('#url').attr('href');
    jQuery('#customquantity').keyup(function(){
      var quantity = jQuery('#customquantity').val();
      jQuery('#url').attr('href', url + '&quantity= ' + quantity);
    });
  });