Question

这是我的HTML代码。

<p>Men's Shirt (on hanger) 
<span class="cart_minus"> - </span>
<span class="cart_add"> + </span> 
<label class="text_right"> 2 Suits </label> </p>
<div class="total"> Total <span>£22.00</span></div> 
<a href="" class="order_now"> Order now </a>

JQuery代码。

$(document).ready(function() {
$('.cart_minus').click(function () {
            alert("hai");
});
});

当我在控制台中放入相同的代码时，会显示警报。我怎么能解决这个问题。

Answer 1

您可能错过了HTML文件中的JQuery库。你的代码效果很好。此外，如果它们是动态创建的，您可以使用下面的代码，它将向动态创建的元素添加一个事件侦听器，并将其附加到document对象。

＆＃13;

$(document).on('click','.cart_minus', function () {
    alert("hai");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Men's Shirt (on hanger) 
<span class="cart_minus"> - </span>
<span class="cart_add"> + </span> 
<label class="text_right"> 2 Suits </label> </p>
<div class="total"> Total <span>£22.00</span></div> 
<a href="" class="order_now"> Order now </a>

＆＃13;

Answer 2

您的所有代码都适用于我。只需确保在使用之前添加了jQuery。

<p>Men's Shirt (on hanger) 
<span class="cart_minus"> - </span>
<span class="cart_add"> + </span> 
<label class="text_right"> 2 Suits </label> </p>
<div class="total"> Total <span>£22.00</span></div> 
<a href="" class="order_now"> Order now </a>

<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $('.cart_minus').on('click', function () {
      alert("hai");
        });
    });
</script>

单击事件不起作用但在放入控制台时可以正常工作

2 个答案: