Question

我很想实现一个用外部链接打开新窗口的功能。我正在创建动态内容，并希望编写一个函数，打开一个带有给定链接的弹出窗口。请帮忙。我喜欢jquery对话框和lightwindo等。但我无法实现任何这些，任何帮助都将是gerat，我对这个假设的小问题感到困惑和沮丧。。。到目前为止，没有任何选项适用于他们。这里是我如何显示结果的代码，以及我认为我必须调用该函数来打开一个新窗口。所以这里的第二个功能是我需要一些帮助，打开一个显示信息的漂亮弹出窗口..

// --------------------- display the course results -> structuring the returned array, to output all information into a table ----------------------
function displayCourses()
{

    var str = ' <table border="0" width="530">' +
                '<tr>' +
                    '<td width="150">Title / course code</td>' +
                    '<td>INFO</td>' +
                '</tr>';

    if(curCourseList == null)
    {
        str = str + '<tr><td colspan="2"><div id="msgDips"></div></td></tr>';
    }
    else
    {
        for (var i = 0; i < curCourseList.length; i++)
        {
            str = str + '<tr><td valign="top" width="150"><a style="cursor:pointer;" onclick="showCourse(\''+curCourseList[i][0]+'\')" >' + curCourseList[i][0] + ' <br /> </a>' + curCourseList[i][1] +'<br>'+ curCourseList[i][3] +'<br /><br />'+ curCourseList[i][4] +'</td><td>' + curCourseList[i][2] +'</td></tr>';
        }
    }

    str = str + '</table>';

    document.getElementById("courseContainer").innerHTML = str;
    if(curCourseList == null)
    {
        getLangToken('99');
    }

}    
function showCourse(code)
{
    //alert(1)
    $.ajax({
        async:false,
        type: "POST",
        url: 'formPostsUser.php?reqtype=getCourse',
        data:'coursecode='+ code,
        success: function(data) 
        {
            newwindow=window.open(url,'name','height=200,width=150');
    if (window.focus) {newwindow.focus()}
    return false;
        }
    });
}

严重的任何帮助都会受到很大的影响。我在这么深的狗屎atm

修改---------------

这是window.open位我会替换打开一个漂亮的花哨弹出窗口，而不是新的浏览器窗口或页面

Answer 1

我不知道为什么你说对话框不起作用或特别是如果jQuery UI对话框不适合你，但以防万一：

$(function() {
    $("<div id='helpDialog' style='display:none' />").appendTo(document);
    $("#helpDialog").dialog({
        autoOpen: false
    });
    $("#helpDialog").dialog('option', 'buttons', {
        "Close": function() {
            $(this).dialog("close");
        }
    })
});

function helpPopUp(page, height, width) {
    $("#helpDialog").dialog('option', 'height', height);
    $("#helpDialog").dialog('option', 'width', width);
    $('#helpDialog').load(page);
    $('#helpDialog').dialog("open");
}
helpPopUp('#helpDialog', 'Help/Summary.html', 550, 750);

您当然可以将.load(page)修改为引用您网址中的网页所需的自定义IF。

以上是上面的一个简单示例，其中有一个轻微的mod来加载您的表而不是页面：http://jsfiddle.net/MarkSchultheiss/ABqrD/1/

Answer 2

如果您通过用户互动以外的任何其他方式触发窗口，则很可能会被阻止。你有没有检查过与此有关的通知？

Answer 3

如果你不想使用真正的弹出式窗口，你可以尝试创建一个<div>，它“悬停”在页面上方，例如

.hoverwindow {
     position:absolute; 
     width: ...px; 
     height:...px; 
     margin:auto;
     z-index:10; /*ensure that it's displayed on top*/
}

您可以通过对功能进行少量修改来完成此操作：

function showCourse(code)
{

$.ajax({
    async:false,
    type: "POST",
    url: 'formPostsUser.php?reqtype=getCourse',
    data:'coursecode='+ code,
    success: function(data) 
    {
        var newwindow = $('<div class="hoverwindow" />');
        newwindow.html(data).appendTo('body');
    }
});
}

虽然坦率地说这就是“弹出窗口”的插件所做的事情，所以如果你搜索它，所有这些都应该可以在网上找到。因此，为什么我没有费心去尝试和测试这段代码 - 它只是想知道你能做些什么。

JavaScript弹出窗口打开外部页面

3 个答案: