AJAX-每当调用AJAX脚本时,JavaScript就会中断 - javascript

我雇用了一名开发人员来帮助完成某些工作,他主要专注于PHP,并尝试了这种javascript。每当以下AJAX脚本将HTML重新加载到DOM中时,它都会中断页面​​。它通过Codenigniter调用了一个函数以重新加载页面中的view。一旦发生这种情况,所有的javascript将不再起作用。

我似乎找不到能帮助解决此问题的解决方案。请帮忙。

注意:理想情况下,我宁愿代码只加载数据,也不刷新HTML,但是现在这需要做,因为我要紧跟时间轴。

编码:

$(document).ready(function () {

    // Ajax Form Submit
    $('body').on('click', '.submitForm', function () {

        var formid = $(this).parents('form').attr('id');
        var validationResult = $('#' + formid).validationEngine('validate');
        if (!validationResult) {
            return false;
        }
        var url = $('#' + formid).attr('action');
        var formdata = $('#' + formid).serialize();
        if ($('#' + formid).find('.submitForm').hasClass('loading')) {
            $(this).hide();
            $('#' + formid).find('.loader').show();
        }
        $.ajax({
            type: "POST",
            cache: false,
            url: url,
            data: formdata,
            dataType: 'json',
            success: function (data) {
                if ($('#' + formid).find('.submitForm').hasClass('loading')) {
                    $('#' + formid).find('.submitForm').css('display', 'inline');
                    $('#' + formid).find('.loader').hide();
                }

                if (data.type == 'add') {
                    if (data.html) {
                        var newhtml = "<tr>" + data.html + "</tr>";
                        $('.tab-pane.active table').append(newhtml);
                    }
                    $('#' + formid).find('.message').html(data.msg).show();
                    $('#' + formid).trigger('reset');
                    setInterval(function () {
                        $('#' + formid).find('.message').hide();
                    }, 5000);
                } else {
                    if (data.error) {
                        $('#' + formid + ' .message').show().html(data.error);
                    } else {
                        $('#' + formid + ' .message').show().html(data.msg);
                        if (data.reload_loc) {
                            window.setTimeout(function () {
                                window.location.href = data.reload_loc;
                            }, 4 * 1000);
                        }
                    }
                }
            }
        });
    });


    // Generic Save Form Data
    $('body').on('click', '#saveFormdata', function () {
        var formid = $(this).parents('form').attr('id');
        var validationResult = $('#' + formid).validationEngine('validate');

        if (!validationResult) {
            return false;
        }

        $('#' + formid).submit();
    });
});

javascript大神给出的解决方案

您只需执行以下操作:

function bindEvent()
{
    $('body').on('click', '.submitForm', function () { //Your code });
    $('body').on('click', '#saveFormdata', function () { //Your code});
}

function unblindEvent()
{
    $('body').off('click', '.submitForm'); //Something like this, please read Jquery.off 
    $('body').off('click', '#saveFormdata');
}

在替换这些元素之前,请调用unblindEvent()。在替换了这些元素之后,调用bindEvent()。

ajax正在加载页面以返回POST请求 - javascript

当我通过ajax发出“ POST”请求时,返回请求时页面正在加载。我们不使用ajax阻止整个页面重新加载吗?这是我的html代码:<form method="post"> <div align="center" class="col-md-10"> <input typ…

提交初始化后删除某些帖子数据 - javascript

在初始化提交之后但在将数据发送到处理页面之前,是否可以过滤$ _POST表单数据?我想象过程的方式:提交->收集$ _POST数据->发送数据我想做的事:提交->收集$ _POST数据->删除某些元素->发送数据这样就不必更改处理页面以过滤掉不希望接收的元素了吗? javascript大神给出的解决方案 当然可以,您可以在JS …

XMLHttpRequest和jQuery AJAX方法之间的响应标头区别 - javascript

亲爱的我的问题不是重复的。码:var data = {'userId': window.cookie.get('userId'), 'sessionId': window.cookie.get('sessionId')} $.post(window.DbUrl + '/…

AJAX-如何在弹出菜单中运行脚本 - javascript

我有一个弹出菜单,此菜单打开并显示文本。我想要的是能够将控制器附加到弹出菜单。例如:我希望显示一个编辑配置文件弹出窗口,其中包含编辑该配置文件的所有必要输入。userprofile_view.php: <div class="upload"> <?php $data = array('id' =>…

如何正确将php变量传递给Ajax调用? - javascript

我有三个文件。我的主要php文件,functions.php,然后是我的js文件。如何将这个php变量传递给js?这是我的主要PHP文件的代码function ccss_show_tag_recipes() { global $post; global $wp; $html = ''; $url = home_url( $wp->r…