使用jQuery对话框时如何阻止基本页面重新加载

Question

我的editRecords.php页面上有以下代码。 该页面是一个记录表，当我单击视图链接时，它将打开一个对话框，其中包含displayRecord.php页面。 问题是，如果我打开表中的最后一条记录而不是打开/关闭对话框，并且editRecords.php页面保持原样，它似乎会重新加载，这使我回到了页面顶部。

$(document).ready(function() { 

     //creating a dialog box
     var dlg=$('#ticketDetails').dialog({
        title: 'Ticket Details',
        resizable: false,
        autoOpen:false,
        modal: true,
        hide: 'fade',
        width: 1300

     });

    //loading dialog box with record
    $('a.view').click(

    function(e) 
    {
         dlg.load('displayRecord.php?id='+this.id, function(){ 
         dlg.dialog('open');
         });

      });

});

我尝试使用e.preventDefault()但这会导致对话框加载时将焦点放在中间而不是顶部。

function(e) 
        {
                 //tested here e.preventDefault();
             dlg.load('displayRecord.php?id='+this.id, function(){ 
             dlg.dialog('open');
             });
         //tested here e.preventDefault();

如何解决/调整这种行为？

谢谢。

澄清： e.preventDefault()可以工作，但问题是它导致对话框加载焦点位于中间的对话框。 我没有问题打开或关闭对话框。 我只想阻止重新加载基本页面（editRecords.php）（或看起来像重新加载页面），这样当我关闭对话框时，我看到的记录是单击的，而不必再次向下滚动。

Answer 1

让我们看看如何在此对话框中动态加载内容

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Load Page Dynamically inside a jQuery UI Dialog</title>
<link rel="Stylesheet" type="text/css" href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css
" />
<script  type="text/javascript" src="
http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js">
</script>
<script type="text/javascript" src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js">
</script>

<script type="text/javascript">
    $(function ()    {
        $('<div>').dialog({
            modal: true,
            open: function ()
            {
                $(this).load('Sample.htm');
            },         
            height: 400,
            width: 400,
            title: 'Dynamically Loaded Page'
        });
    });
</script>
</head>
<body>

</body>
</html>

如您所见，我们正在动态创建一个div元素，并为open事件指定了一个回调，该回调将动态加载页面“ Sample.htm”的内容。

多次打开和关闭对话框不会将对话框从页面中删除。 如果要实现close事件，请在对话框选项中使用以下代码（未经测试的代码）：

close: function(e, i) { $(this).close(); }

就这样！

使用jQuery对话框时如何阻止基本页面重新加载

问题描述

1 个解决方案

解决方案1
0 2012-12-28 01:12:19

使用jQuery对话框时如何阻止基本页面重新加载

问题描述

1 个解决方案

解决方案1 0 2012-12-28 01:12:19

解决方案1
0 2012-12-28 01:12:19