将URL加载到div中

时间:2014-12-20 02:07:27

标签: javascript

此脚本使用IFRAME加载内容有没有办法只从页面加载内容而不是iframe?

类似

$("#content2").load($(this).attr("page"));

但我似乎无法使其适用于上述脚本。

<script type="text/javascript">
function loadURL(u) { 
document.getElementById("web-panel").innerHTML = '<iframe src="' + u + '"
width="100%" height="100%" border="0"></iframe>';}</script>

<select name="mydropdown" id="url" onchange="loadURL(this.value);">
<option value="http://123.com/opt.php?3">opt3</option>
<option value="http://123.com/opt.php?2">opt2</option>
<option value="http://123.com/opt.php?1">opt1</option>
</select>

<div id="web-panel"></div>

2 个答案:

答案 0 :(得分:0)

看起来你有JavaScript语法错误。

将JS部分更改为:

function loadURL(u) { 
    document.getElementById("web-panel").innerHTML = '<iframe src="' + u +
    '" width="100%" height="100%" border="0"></iframe>';
}

答案 1 :(得分:0)

要在不使用IFrame的情况下将URL的内容加载到div中,您可以尝试使用jQuery Ajax方法:(第一行很重要,因为它包含jQuery框架)

<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
function loadURL(u) { 
    $.ajax({
        url: u,
        cache: false
    }).done(function(data) {
        $("#web-panel").html(data);
    });
}
</script>

<select name="mydropdown" id="url" onchange="loadURL(this.value);">
<option value="http://123.com/opt.php?3">opt3</option>
<option value="http://123.com/opt.php?2">opt2</option>
<option value="http://123.com/opt.php?1">opt1</option>
</select>

<div id="web-panel"></div>