Jquery 数量加上减不起作用

Jquery 数量加上减不起作用,jquery,html,ajax,Jquery,Html,Ajax,我在html中有一个数量加减框,它是从jQuery脚本嵌入的,如下所示 jQuery.ajax({ type: "POST", url: "http://ayambrand-com-my-v1.cloudaccess.host/index.php?option=com_echarity&format=raw&task=api.get_product_name",

我在html中有一个数量加减框,它是从jQuery脚本嵌入的,如下所示

jQuery.ajax({
                    type: "POST",
                    url: "http://ayambrand-com-my-v1.cloudaccess.host/index.php?option=com_echarity&format=raw&task=api.get_product_name",
                    data: {dataArrayPost : Data},
                    success: function(data){
                        // console.log(data);
                        var a = JSON.parse(data);
                        //console.log(a);
                        var prodName = a.productName; 
                        var splitProductName = "";
                        var prodQty = a.quota; 
                        var splitProductQuota = "";
                        var prodPrice = a.price;
                        var splitProductPrice = "";
                        var discountedPrice = "";

                        var formQuantityUpdate = "<div class='amount-controller' data-module='amount-controller'><span id='qtyminus' field='quantity' class='handle'><i class='iconfont'>-</i></span><input class='input-num' type='text' id='num' name='number'><span id='qtyplus' field='quantity' class='handle qtyPlusHandle'><i class='iconfont'>+</i></span></div>";
                        var contents = '<table id="tableDonateDisplay" class="table table-hover">';
                        contents += "<tr>";
                        contents += '<th>' + 'Product' + '</th>' + '<th>' + 'Quantity Need' + '</th>' + '<th>' + 'Price Each' + '</th>' + '<th>' + 'My Donation' + '</th>' + '<th>' + 'Amount' + '</th>';
                        jQuery.each(prodName, function(index1, value1) {
                            splitProductName = value1;
                            contents += "<tr>";
                            contents += '<td>' + splitProductName;
                            jQuery.each(prodQty, function(index, value) {
                                if (index1 == index) {
                                    splitProductQuota = value;
                                    contents += '</td><td>' + splitProductQuota;
                                    jQuery.each(prodPrice, function(index2, value2){
                                        jQuery.each(value2, function(index3, value3){
                                            if(index == index2){
                                                splitProductPrice = value3.price_value_with_tax;
                                                console.log(splitProductPrice);
                                                contents += '</td><td>' + 'RM ' + splitProductPrice.toFixed(2) + '</td>';
                                                contents += '<td>' + formQuantityUpdate + '</td>' + '<td>' + '' + '</td>' + '<td>' + '' + '</td>';
                                                contents += "</tr>";
                                            }
                                        });
                                    });
                                }
                            });
                        });

                        contents += "</tr></table>";

                        if (jQuery('#contentNeed').html()) {
                            //alert('The container contains something.');
                            jQuery( "#contentNeed" ).empty();
                        }else {
                            //alert('The container is empty.');
                        }

                        jQuery('#contentNeed').append(contents);
                    }
                });
在frontpage中显示时,它不起作用。当我尝试在JSFIDLE上运行脚本时,它不会出现任何问题。控制台上没有错误消息或任何内容

这是部分

有人能帮我一下吗。

jQuery(element)。单击()
仅适用于已加载的元素,但这里是在ajax请求后加载字段,因此需要像下面这样使用

jQuery(“#qtyplus”)。单击(函数(e){

jQuery(“#qtyminus”)。单击(函数(e){

jQuery(“.qtyPlusHandle”)。单击(函数(e){


演示:

id应该是唯一的,并且您应该使用委托事件处理程序在动态创建的元素上绑定事件。您在console中是否收到任何错误?如果没有错误,请在console@Johnsackson上发布任何错误
jQuery(document).ready(function() {
    // console.log('lulu');

    jQuery('#qtyplus').click(function(e) {
        // console.log('lala');

        e.preventDefault();

        fieldName = jQuery(this).attr('field');

        var container = jQuery(this).parents('.amount-controller');
        var currentVal = parseInt(container.children(".input-num").val());
        var val2 = currentVal + 1;

        if (!isNaN(val2)) {
            container.children(".input-num").val(val2);
        } else {
            container.children(".input-num").val(0);
        }
    });

    jQuery("#qtyminus").click(function(e) {
        e.preventDefault();

        fieldName = jQuery(this).attr('field');

        var container = jQuery(this).parents('.amount-controller');
        var currentVal = parseInt(container.children(".input-num").val());

        if (!isNaN(currentVal) && currentVal > 1) {
            container.children(".input-num").val(currentVal - 1);
        } else {
            container.children(".input-num").val(1);
        }
    }); 

    jQuery(".qtyPlusHandle").click(function(e) {
       console.log('lili');
    });
    // jQuery('span#qtyplus').on('click', function() { alert(1); });
});
jQuery(document).on('click','#qtyplus',function(e){
jQuery(document).on('click', '#qtyminus', function(e) {
jQuery(document).on('click', '.qtyPlusHandle', function(e) {