使用xhr时，JQuery对话框关闭不工作

JQuery dialog close is not working when using xhr

本文关键字：工作对话框 JQuery xhr 使用更新时间：2023-09-26

我正在尝试使用xhr aJax制作一个网页。

我收到Jquery对话框通过xhr。responseText .

a.p jsp(实际查看页面的获取数据部分)

function getOrderData(tableid){
    if(xhrGetOr) {
        xhrGetOr.open("GET", "http://localhost:8080/Erpos/POS_orderAjaxGet.html?id="+tableid,true);
        xhrGetOr.onreadystatechange = function() {
            if(xhrGetOr.readyState == 4 && xhrGetOr.status == 200){
                var dialog = $(xhrGetOr.responseText).appendTo('body');
                viewdialog();
            }
        }
        xhrGetOr.send(null);
    }
}

当我点击一些按钮时，getOrderData()被调用，当接收到所有数据时，viewdialog()方法也被调用。因此，对话框显示在网页中。

POS_orderAjaxGet.jsp

   <script>
           function viewdialog() {
                          $( "#dialog" ).dialog({
                            closeOnEscape: false,
                            autoOpen: true,
                            resizable: false,
                            draggable: true,
                            move:false,
                            height:830,
                            width:1085,
                            modal: true,
                            position:[0,0]
                          });
                        }
          function closeMenu() {
                        alert("close event");  // this is well displayed
                        $( "#dialog" ).dialog("close");
                    }
    </script>
<body>
    <div id="dialog" title="order">
         <input id="ocancel"type="button" class="btn" value="close"       
          onclick="closeMenu();"> 
    </div>
</body>

一切顺利。但是$("#dialog").dialog("close")不起作用。因此，我将closeMenu()函数移到了a.p jsp中。也不工作…pure POS_orderAjaGet的closeMenu()工作得很好。我认为a.p jsp找不到id 'dialog'

让我知道是什么问题。

function closeMenu() {
    document.getElementById("dialog").parentNode.remove();
}

同样的工作。但我认为这不是一个好的解决方案。