将一个工作的jQuery表单复制到另一个位置,但只复制原来的工作

copied a working jQuery form to another location but only the original works?

本文关键字:工作 复制 另一个 原来 位置 jQuery 一个 表单      更新时间:2023-09-26

我已经将一个工作的jQuery表单从一个页面复制到另一个页面,原始的工作如预期的,但副本没有。

原文如下:所以我有一个onclick函数附加到一个图像,打开一个确认模态窗口与一个"OK"按钮(aka)我的提交按钮,按下这个提交一个post函数,关闭窗口,并创建一个帖子在另一个页面(主页)。

我已经将这个工作表单复制到我的主页上,这样用户就不必去上面提到的页面来完成这个任务。但是,在重复的表单上点击"确定"按钮后,它会关闭窗口并刷新页面,但是post函数似乎没有触发。

代码如下:

<script>
            jQuery(function (){
                jQuery('#form-bumb .button-waiting, #form-bumb .waiting-updated').hide();
                jQuery('#form-bumb').submit(function (e){
                    e.preventDefault();
                    //product_id
                    jQuery('#form-bumb .waiting-updated').hide();
                    jQuery('#form-bumb .button-waiting').show();
                    jQuery.ajax({
                        url : the_ajax_script.ajaxurl,
                        type : 'post',
                        data : {
                            action : 'product_bump',
                            product_id : <?php echo $product_id; ?>
                        },
                        success : function( response ) {
                            jQuery('#form-bumb .button-waiting').hide();
                            jQuery('#form-bumb .waiting-updated').show();
                            jQuery('#form-bumb button[type=submit]').hide();
                            remaining_bump = jQuery('.products-total-wrap #products-total-bumps').text();
                            if (remaining_bump > 0){
                                remaining_bump = parseInt(remaining_bump) - 1;
                                jQuery('.products-total-wrap #products-total-bumps').text(remaining_bump);
                            }
                        }
                    });
                });
                jQuery('#modal_product_message_confirmation h4.modal-title').html('Bump Confirmation '+
                            '<img src="<?php echo get_template_directory_uri();?>'+
                            '/assets_consumer/assets/img/bump-icon.png" width="20" />');
            });
            </script>

我不知道是什么问题,如果有人能给我指出正确的方向,我将不胜感激。

也许你的表单是动态生成的,#form-bumb在运行jQuery('#form-bumb').submit(function (e){....})时不存在

你应该试试

$(document).on('submit','#form-bumb',function(e){....})

如果它是动态创建的,也会对表单起作用