基于选项值选择问题的Javascript重定向

Question

我有以下HTML代码：

<select class="fly" id="size">
  <option value="S">S</option>
  <option value="M">M</option>
  <option value="L">L</option>
</select>

<a href="#" class="item_add" id="BuyButton">Buy</a>

然后跟随JS：     
    

var s = document.getElementById("size");
var strSize = s.options[s.selectedIndex].value;


document.getElementById("BuyButton").onclick = function () {
location.href = "../add_to_cart.php?product=<?php echo $id; ?>&size=" +strSize;
};

当有人单击“购买”按钮时，我想使用id和size参数在add_to_cart.php文件中将其重定向。 ID可以，但是使用基于JS的参数SIZE会出现问题，因为无论在SELECT表单中选择什么，它始终会获得第一个值。在这种情况下，它是“ S”值。哪里出问题了？谢谢。

Answer 1

您需要将所有内容放入函数中，否则仅在页面加载时才会采用选定的选项。

document.getElementById("BuyButton").onclick = function () {
   var s = document.getElementById("size");
   var strSize = s.options[s.selectedIndex].value;
   location.href = "../add_to_cart.php?product=<?php echo $id; ?>&size=" + strSize;
};