Question

我试图从颜色中抓取所选的选项，但每次返回空白时。当它在将其添加到汽车后进入购物车页面时，它将返回空白而不是选定的颜色选项。

＆＃13;

// Adds items to the shopping cart

handleAddToCartForm: function() {
  var self = this;
  self.$formAddToCart.each(function() {
    var $form = $(this);
    var $product = $form.parent();
    var price = self._convertString($product.data("price"));
    var name = $product.data("name");
    
    //Problem here
    var color1 = $("#color1 option:selected").val();

    $form.on("submit", function() {
      var qty = self._convertString($form.find(".qty").val());
      var subTotal = qty * price;
      var total = self._convertString(self.storage.getItem(self.total));
      var sTotal = total + subTotal;
      self.storage.setItem(self.total, sTotal);
      self._addToCart({
        product: name,
        price: price,
        qty: qty,
        color1: color1
      });
      var shipping = self._convertString(self.storage.getItem(self.shippingRates));
      var shippingRates = self._calculateShipping(qty);
      var totalShipping = shipping + shippingRates;

      self.storage.setItem(self.shippingRates, totalShipping);
    });
  });
},

＆＃13;

<div class="product-description" data-name="Rainbow" data-price="12">
  <h3 class="product-name">Rainbow</h3>
  <p class="product-price">$ 12</p>
  <p class="select-color">Color 1:
    <select id="color1">
      <option value="blank"></option>
      <option value="white">White</option>
      <option value="red">Red</option>
      <option value="orange">Orange</option>
      <option value="yellow">Yellow</option>
      <option value="green">Green</option>
      <option value="blue">Blue</option>
      <option value="purple">Purple</option>
      <option value="pink">Pink</option>
      <option value="black">Black</option>
    </select>
  </p>

＆＃13;

Answer 1

您需要获取提交事件处理程序中的颜色。您目前正在尝试在用户更改任何内容之前执行此操作

更改

var color1 = $("#color1 option:selected").val();

$form.on("submit", function() {

要

$form.on("submit", function() {
    // get color when user submits . Need to also do some validation
    var color1 = $("#color1 option:selected").val();

Jquery选项：选中不起作用

1 个答案: