Question

我有一个替换文本节点内容的脚本。它在初始页面加载时效果很好，但是当我导航到另一个打开更多需要替换的内容的选项卡时，它不起作用。我需要找到一种方法来重新运行脚本函数，以便在单击新选项卡并加载额外内容后替换文本。最好，我还需要在运行函数之前等待新内容加载，否则它不会替换所需的所有节点内容。

以下是最终确定的替换脚本：Replace non-code text on webpage

var getTextNodesIn = function(el) {
    return $(el)
    .find(":not(iframe, script, style)")
    .andSelf()
    .contents()
    .filter(function() {
        return this.nodeType == 3;
    });
};

function changeText() {
    var re = new RegExp(/^\$(\d+)/);
    getTextNodesIn($('div')).each(function() {
        if (re.test($(this).text().trim()) === true) {
            var txt = $(this).text().trim();
            txt = txt.replace(re,"%$1");
            $(this).replaceWith(txt);
        }
    });
}

$(document).ready(function() {
    changeText();
});

单击以加载新标签内容的按钮HTML如下所示：

<a href="#" id="m_id0:Form_id45" name="m_id0:Form_id45" onclick="getTabSwitchId('78396'); if(!verifyRChange()) return false; saveTextBeforeReset();if(window != window.top){var f = document.getElementById('m_id0:Form');f.action += (f.action.indexOf('?') == -1 ? '?' : '&amp;');};A4J.AJAX.Submit('m_id0:Form',event,{'similarityGr‌oupingId':'m_id0:For‌m_id45','oncomplete'‌:function(request,ev‌ent,data){checkRequi‌red('','Tab 1');},'parameters':{'tabId':'78396','appID':'54362','id':'53‌4','m_id0:Form_id45'‌:'m_id0:Form_id45'} ,'status':'m_id0:Form:m_id21:5:tabSwitch'} );return false;">Second Tab</a>

在加载新内容时，是否可以在该代码中使用某些内容来侦听和运行changeText（）函数？请注意，我可能不想使用按钮中的任何ID，因为这必须适用于可能具有不同ID的多个按钮。

此外，它甚至不必是按钮特有的更改，只是在HTML更改时会触发该功能的任何内容。例如，我尝试了以下选项，但它导致＆＃34;超出最大调用堆栈大小＆＃34;错误以及其他问题，因为它不会等待所有更改完成。

$(document).bind("DOMSubtreeModified",function(){
    changeText();
});

Answer 1

我想我用这块魔法解决了这个问题：https://stackoverflow.com/a/27363569

(function() {
    var origOpen = XMLHttpRequest.prototype.open;
    XMLHttpRequest.prototype.open = function() {
        console.log('request started!');
        this.addEventListener('load', function() {
            console.log('request completed!');
            console.log(this.readyState); //will always be 4 (ajax is completed successfully)
            console.log(this.responseText); //whatever the response was
        });
        origOpen.apply(this, arguments);
    };
})();

请注意，我不能简单地使用以下内容，因为我的页面没有使用$ .ajax（）或任何jQuery ajax方法来实际加载内容。但对于任何人来说，它都是一个很好的快速解决方案。

$(document).ajaxComplete(function() {
  alert("ALL current AJAX calls have completed");
});

通过Ajax

1 个答案: