使用jquery添加Select选项无效

时间:2017-12-12 08:02:13

标签: jquery html

我正在尝试根据所选组合的产品数量调整选项值。我做了如下:

 var html='';
 jQuery.each(array, function(i,val){
      html +='<option value="'+val+'">'+val+'</option>';
 });
 var select_div='<select id="ajaxselect"  name="product_qty">'+html+'</select>';
 // alert(old_price);
 $('#select_quantity').html(select_div);
 $("#ajaxselect").css({
      width: "50px", height: "50px", display: "block", top: "0px", left: "0px",
 });

定义数组并且其值即将到来。

这将在jquery效果

之后给我这个
 <div id="select_quantity">
      <select id="ajaxselect" name="product_qty" style="width: 50px; height: 50px; display: block; top: 0px; left: 0px;">
           <option value="1">1</option>
           <option value="2">2</option>
           <option value="3">3</option>
           <option value="4">4</option>
           <option value="5">5</option>
           <option value="6">6</option>
      </select>
 </div>

但是在选择和提交表单后,product_quantity不会作为post元素提交 帖子如下

 Array ( 
      [id] => 2 
      [name] => Cardigan Stitch 
      [img] => /images/product/174febdfab0e13f983cc3cce91c1a5b9.jpg 
      [pc_id] => 1 
      [price] => 15 
      [product_color] => 2 
      [product_size] => 4 
      [add_to_cart] => )

虽然它应该是这样的:

 Array ( 
      [id] => 2 
      [name] => Cardigan Stitch 
      [img] => /images/product/174febdfab0e13f983cc3cce91c1a5b9.jpg 
      [pc_id] => 1 
      [price] => 15 
      [product_color] => 2 
      [product_size] => 4 
      [product_qty] => 1 
      [add_to_cart] => )

我在另一个项目中做了同样的工作,并在那里工作得很好。但它不在这里工作。谁能帮帮我吗。尝试解决它3个小时。任何形式的帮助表示赞赏。谢谢。

2 个答案:

答案 0 :(得分:1)

确保您的div [{1}}位于提交的#select_quantity标记内。也许你在源代码中有一个错位的结束标记。

答案 1 :(得分:0)

我们可以使用:selected来获取所选值。希望这会有所帮助。

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
   
  var html='';
            jQuery.each(Array, function(i,val){
            html +='<option value="'+val+'">'+val+'</option>';
            });
            var select_div='<select id="ajaxselect" name="product_qty">'+html+'</select>';
            $('#select_quantity').html(select_div);
            alert($( "#select_quantity option:selected").text())
            
            $("#ajaxselect").css({
            width: "50px", height: "50px", display: "block", top: "0px", left: "0px",
            });


});
</script>
</head>
<body>


</body>
</html>