为什么jquery click事件无法触发？

Question

1. default.aspx click on the + symbol to increase the quantity. and - symbol for decrease the quantity.

     <div class="sp-quantity"> <div class="sp-minus fff"> <a class="ddd" href="#">-</a> </div> <div class="sp-input"> <asp:TextBox ID="txtQuantity" runat="server" CssClass="popuptextbox quntity-input" Width="30px" Text='<%#Eval("Quantity")%> '></asp:TextBox> </div> <div class="sp-plus fff"> <a class="ddd" href="#">+</a> </div> <%--<asp:LinkButton ID="lbtnUpdateQuantity" runat="server" CommandName="Update"><i class="fa fa-check-circle" style="color:#00374A"></i></asp:LinkButton>--%> </div> jquery: <script type="text/javascript"> $(".ddd").on("click", function () { var $button = $(this); var oldValue = $button.closest('.sp-quantity').find("#ContentPlaceHolder1_gvItems_txtQuantity").val(); //var oldValue = $("#ContentPlaceHolder1_gvItems_txtQuantity").val(); if ($button.text() == "+") { var newVal = parseFloat(oldValue) + 1; } else { if (oldValue > 0) { var newVal = parseFloat(oldValue) - 1; } else { newVal = 0; } } $button.closest("#ContentPlaceHolder1_gvItems_txtQuantity").val(newVal); }); </script> 

   In this when I click on the + symbol no event firing.How do i do with that jquery?

Answer 1

You need to wrap your code inside $(document).ready() :

 $(document).ready(function(){
      $(".ddd").on("click", function () {
         ...
      })
 });

Answer 2

Add your jQuery stuff, inside this function

$(function() {
    //jQuery stuff
})

Answer 3

keep your jquery code inside head section its just counts in best practices and one thing more add this code in

$(document).ready(function(){

 });

this will attach the events to the elements of given class when you document is ready and fully loaded/Dom is ready.