修改javascript函数使PHP页面以弹出窗口的形式出现 - alter javascript function so that php page will come as pop up window

我是Javascript新手。实际上我有一个Javascript函数。

function addHyperlink(val,row){
      var temp = row.id;
            var temp2 = row.assignee;
            var temp3 = row.status;
            var temp4 = row.area;
            var temp5 = row.product;
            var temp1 = '<?php echo $_SESSION['username']; ?>';
            var redirect="edit_comments.php?id=" + temp + "&username=" + temp1 + "&assig=" + temp2 + "&stat=" + temp3 + "&areaa=" + temp4 + "&prod=" + temp5;
return '<a href="' + redirect + '" >Edit Remarks</a>';
}

如果我点击"Edit comments"超链接，它将重定向到带有参数的"edit_comments.php"页面。它工作得很好。现在我想改变这个功能，这样如果我点击"编辑备注"超链接，"edit_comments.php"页面将以弹出窗口的形式打开，而不是新选项卡或新窗口。

有谁能告诉我在这个功能上我需要改变什么吗?

提前感谢。

Br,从

您可以使用window .open()函数在新窗口中打开URL，如下所示

var myWindow = window.open("http://www.yoururl.com", "", "width=200, height=100");

你可以在这里找到你可以设置的所有属性

http://www.w3schools.com/jsref/met_win_open.asp

请记住，许多浏览器会尝试阻止这种弹出。

在你的代码中你可以

function addHyperlink(val,row){
    var temp = row.id;
    var temp2 = row.assignee;
    var temp3 = row.status;
    var temp4 = row.area;
    var temp5 = row.product;
    var temp1 = '<?php echo $_SESSION['username']; ?>';
    var redirect="edit_comments.php?id=" + temp + "&username=" + temp1 + "&assig=" + temp2 + "&stat=" + temp3 + "&areaa=" + temp4 + "&prod=" + temp5;

    return '<a href="#" onclick="window.open(''' + redirect + ''', '''', ''width=200, height=100'')">Edit Remarks</a>';
}

我想这会让你朝着正确的方向前进

您可以看一下对话框解决方案，其中链接在IFRAME元素中呈现。与一个对话框没有新的窗口或选项卡创建，你永远不会离开你的当前页面，因为它会留在后台。

而且它不会被任何弹出窗口拦截器捕获。

如果这是你想要的，你可以阅读:如何在jQuery UI对话框中显示IFRAME

你可以这样编码

function windowOpenner(url) {
    var myWindow = window.open(url, "window name", "width=200, height=100");
//you can add element/tags like this or using createElement
myWindow.document.write("<input value='close' type='button' onclick='window.close()' />");
}
function addHyperlink(val,row){
  var redirect="edit_comments.php";
return '<a href="#" onclick="windowOpenner('''+redirect+''')">Edit Remarks</a>';
}
document.write(addHyperlink())

UPDATE: 代替在弹出窗口中显示结果，此方法使用Modal，它提供类似的外观和感觉，但也可以对弹出窗口的操作进行更多控制，例如保存或关闭弹出窗口中的信息

使用Ajax:

HTML部分: 步骤1:创建一个隐藏的DIV，具有display: none属性和绝对位置在页面的中心
Javascript部分:
步骤2:在"Edit comments"上添加Click Event，并通过Ajax调用php文件，传递适当的参数
步骤3:如果Ajax成功，onsuccess:使隐藏的DIV可见，并在DIV内容中添加Ajax调用的响应
,
现在你的编辑注释呈现如下:<a href="redirect_url" >Edit Remarks</a>
给它一个ID: <a id="edit_remarks" href="redirect_url" >Edit Remarks</a>
HTML:
<div id="popup" style="display:none;position:absolute;left:35%;top:35%;min-width:80%;min-height:80%;"> <div class="popup_content"> </div> </div>
jquery javascript/
$('#edit_remarks').click(function(){ $.ajax({ method: 'POST', url: 'edit_comments.php', data: {id: temp, username: temp1 } //(as many variables u want to send) }).done(function(msg){ $('#popup .popup_content').html(msg); $('#popup').show(); }); });