子页面提交更新后刷新父窗口列表遇错：window.opener行报Function expected

Hey there, let's work through this issue you're facing. The "Function expected" error is coming from a simple mistake in how you're using innerHTML—plus a couple of other small tweaks we can make to ensure everything runs smoothly.

1. The Core Issue: innerHTML is a Property, Not a Function #

Your code is trying to call innerHTML() like a method, but it's actually a property of DOM elements that you assign a value to. That's exactly what's triggering the error.

Instead of:

window.opener.document.getElementById('tbodyReportList').innerHTML(responseText);

You need to write:

window.opener.document.getElementById('tbodyReportList').innerHTML = responseText;

2. Fix the AJAX Option Typo #

You've got a typo in your jQuery AJAX settings: asynch should be async. While setting it to false works for synchronous requests (though we'll talk about that next), the misspelling might cause unexpected behavior.

3. Add Safety Checks for window.opener #

It's a good practice to verify that the parent window still exists before trying to modify it—especially if the user might have closed the original tab. Add a check like this:

if (window.opener && !window.opener.closed) {
  // Update the parent's content here
} else {
  alert("Parent window no longer exists.");
}

4. (Optional) Avoid Synchronous AJAX #

Using async: false blocks the browser's main thread until the request finishes, which can make your page feel unresponsive. If possible, switch to an asynchronous request (the default for jQuery AJAX) to keep the UI smooth.

Corrected Full Code #

Here's the revised version of your function with all these fixes:

function reloadParent() { 
    jQuery.ajax({ 
        url: 'ReportServlet', 
        type: 'POST', 
        data: {formType: "reloadActions" }, 
        dataType: 'html', 
        async: false, // Fixed typo here
        success: function (responseText) { 
            // Check if parent window is still available
            if (window.opener && !window.opener.closed) {
                var targetElement = window.opener.document.getElementById('tbodyReportList');
                if (targetElement) {
                    targetElement.innerHTML = responseText; // Fixed property assignment
                } else {
                    alert("Target element not found in parent window.");
                }
            } else {
                alert("Parent window is closed or unavailable.");
            }
        }, 
        error: function (request, status, error) { 
            alert("An error occurred. Error: " + status + ", " + error); 
        } 
    }); 
}

Quick Additional Notes #

• Make sure the parent window and child page are served from the same origin (same protocol, domain, and port)—otherwise, browser security restrictions will block access to window.opener.
• If you switch to async: true (removing the setting entirely, since it's default), you don't have to worry about blocking the UI, which is better for user experience.

内容的提问来源于stack exchange，提问作者Bob Stout