Question

我有父元页面，其中有一个元素。该元素弹出窗口的Onclick来了。在弹出窗口中有一个文本框和提交按钮。现在我想点击弹出窗口上的提交按钮时刷新父页面。我有刷新父页面的解决方案：

window.onload = function()
{
  window.opener.location.reload();
}

我在popup jsp页面中添加了这个脚本。因此，每当我点击父页面上的元素时，弹出窗口就会出现并刷新父页面（想跳过这个），然后我在弹出的文本框中添加一些文本并提交数据，因为它是提交按钮弹出窗口再次重新加载和父页面得到刷新（预计会发生）。由于我在弹出页面上使用window.onload，它会刷新两次，我想跳过第一次刷新。所以我决定点击提交按钮进行刷新。 弹出页面JSP代码：

<td align="center">
 <html:submit styleId="btn_add" property="submitButton" onclick="formConfirmOff();" value="Add" />
</td>

我试图跳过第一次刷新的另一个解决方案：

document.getElementById("btn_add").onclick = function(){
        window.opener.location.reload();
    }

但是使用上面的脚本它会给我一个错误无法设置属性onclick of null 所以可能是因为在DOM加载之前脚本正在执行。所以我在

中添加了脚本

window.onload = function(){
        document.getElementById("btn_add").onclick = function(){
            window.opener.location.reload();
        }
    }

但是什么时候会显示带有选项的“确认导航”对话框离开此页面并停留在此页面上。可能是什么问题。传递给onclick的函数顺序是否重要？我只是想使用提交按钮在弹出子页面上添加数据时刷新父页面。

修改

$(document).ready(function() {
        $("#frm_addSpeedData").submit(function(event) {  
        //event.preventDefault();
        $.ajax({
             type: "POST", //chose your request type method POST or GET
              url: "/webapp/addSpeedDataAction.do", // your struts action url
              data: $(this).serialize(),
              success: function() {
                window.opener.location.reload(); // callback code here
              }
            })
        })
    });

有时这段代码有效但有时却无效。意味着当弹出窗口打开时我会在弹出窗口中提交数据。然后成功父窗口刷新。但我仍无法在父页面上看到更新。可能是什么问题？

Answer 1

您需要使用对服务器的AJAX调用手动执行此操作，并且在成功执行后，您将刷新父页面。

以下是使用JQuery Ajax的示例：

<script type="text/javascript">
$(document).ready(function() {
  $("#form_selector").submit(function(event) {  
        event.preventDefault();
        $.ajax({
             type: "POST", //chose your request type method POST or GET
              url: "Your_Action", // your struts action url
              data: $(this).serialize(),
              success: function() {
                window.opener.location.reload(); // callback code here
              }
        })
   })
});
</script>

这是JavaScript版本：

var url = "/webfdms/addSpeedDataAction.do";

xmlHttp.open("GET", theUrl, true);
xmlHttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xmlHttp.overrideMimeType("application/octet-stream");
xmlHttp.responseType = "blob";

xmlHttp.onreadystatechange = function() {
    if (xmlHttp.readyState == xmlHttp.DONE) {
        if (xmlHttp.status == 200) {
            window.opener.location.reload();
        }
    }   
};
xmlHttp.send();

使用strutst html标签时，如何在提交按钮上调用onclick事件？

1 个答案: