Onclick找不到要执行的功能

时间:2019-07-09 04:28:13

标签: javascript

我正在使用onclick()函数将商品添加到购物车。

<button class='btn pull-right' id = 'cartBtn' onclick = 'addToCart(<?php echo $id;?>)'><span class='glyphicon glyphicon-shopping-cart'></span></button>

这是js:

$(document).ready(function(){
    var cart = [];
    var id = $("#itemId").text();
    var stockAvailable = $("itemStock").text();
    var inCart = false;


    function addToCart(item){
        id = item;
            if (inCart == true){
                console.log("item already in cart");
            }
            else{
                cart.push(id);

            }

    }

但是,单击按钮后,控制台中出现以下错误:

ReferenceError: addToCart is not defined

我已经将js代码写在一个单独的文件中,并将其包含在头部中。 这里可能是什么问题

4 个答案:

答案 0 :(得分:1)

如果不定义addToCart,则无法使用。 您可以在要使用此功能的地方定义它。

$(document).ready(function() {
  function addToCart(item) {
    console.log('added');
  }
});
addToCart('item');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

正确的方法

function addToCart(item) {
  console.log('added');
}
$(document).ready(function() {

});
addToCart('item');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

答案 1 :(得分:1)

在这里,我根据您的问题向您展示了非常基本的示例代码

var id, cart = [], stockAvailable, inCart = false;
$(document).ready(function(){
  id = $("#itemId").text();
  stockAvailable = $("itemStock").text();
});

function addToCart(item){
  id = item;
  if (inCart == true){
      console.log("item already in cart");
  }
  else{
      cart.push(id);
      inCart = true;
      console.log("item added in cart");
  }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class='btn pull-right' id = 'cartBtn' onclick = 'addToCart(1)'><span class='glyphicon glyphicon-shopping-cart'></span> Add to Cart</button>

答案 2 :(得分:1)

来自官方的jQuery文档。 https://learn.jquery.com/using-jquery-core/document-ready/

TLDR:document.ready仅运行一次,因此请在其中定义函数。

答案 3 :(得分:0)

无论如何,您都在使用Jquery,所以可以请使用jquery事件处理程序进行检查。

请使用jquery click事件找到答案。

$("#cartBtn").on("click", function(item){
       id = item;
            if (inCart == true){
                console.log("item already in cart");
            }
            else{
                cart.push(id);

            }
        }
   })