Question

我想通过点击像div类box2这样的项目将项目添加到购物车当我点击图像时，我得到了名称和价格，但名称和价格没有添加到ul类添加请帮助我如何从图像中获取值并设置到购物车

 <div class="box2">
              <p>pkr 700.0</p>
               <img src="images/col.png" />
               <h1>Beverges</h1>
    </div>

    <ul class="add">
              <li>bellle belle belle 25cl
                 <p>2 Unit(s) at PKR 0.8/Unit(s)</p>
              </li>
    </ul>
    <script type="text/javascript">
    $(document).ready(function() {
      $('.box2').click(function(){
          var price=$(".box2 p:first").html();
          var product=$(".box2 h1:first").html();
          $(".add li:first").val(product);
          $(".add li p:first").val(price);
          alert(price);
          alert(product);
      });
    });
    </script>

Answer 1

使用text method或html method代替val方法：

$(".add li:first").text(product);
$(".add li p:first").text(price);

或者，

$(".add li:first").html(product);
$(".add li p:first").html(price);

val（）方法仅适用于输入元素类型。

您要将两个值分配给将覆盖的同一元素，因此请使用如下：

$(".add li:first").text(product + " " + price);

更新：根据评论demo

$('.box2').click(function(){
          var price=$(".box2 p:first").html();
          var product=$(".box2 h1:first").html();
    $(".add li:first").contents().filter(function(){
       return this.nodeType == 3;  
    })[0].nodeValue = product;
    $(".add li:first p").text(price);
      });

Answer 2

List item(li)不是input type control，因此val()无效，请尝试使用text()代替

$(".add li:first").text("some text here");
$(".add li p:first").text("some text here");

Answer 3

p和li没有val()

陷阱>

$(document).ready(function() {
  $('.box2').click(function(){
      var price=$(".box2 p:first").html();
      var product=$(".box2 h1:first").html();
      $(".add li:first").html(product);
      $(".add li p:first").html(price);
      alert(price);
      alert(product);
  });
});

通过jquery为购物车增加价值

3 个答案: