导入带有 Ajax 或 Jsonp 的 URL，而不带 iframe

我有这个简单的索引：

<head>
<script src="js/jquery-1.7.1.js" type="text/javascript"></script>
</head>
<body>
<div style="bottom: 0px;position: absolute;">
    <? include("inc/creditos.php")?>
</div>
</body>
</html>

creditos.php：

<script>
// JavaScript Document
$(document).ready(function(){                   
    $('#show_credits').click(function(){
        //$('iframe#cred').css("display","none");
        var pos=$(this).position();
        if (pos.left>200) pos.left=pos.left-250;                                  
            $('#cred').css("top",pos.top-240);                            
            $('#cred').css("left",pos.left);
            $('#cred').fadeIn("slow");
            //$("iframe#cred").contents().find("#creditos").css('display','none');
            $('#close').css("background-color","red");  
            $('#close').css("top",pos.top-223);                           
            $('#close').css("left",pos.left+293);
            $('#close').css("position","absolute");
            $('#close').fadeIn("slow");
            $('#close').css("z-index","1");
            $('#close').css("width","20px");
            $('#close').css("height","20px");           
        });
    $('#close').click(function(){
        $('#cred').fadeOut("slow");
        $('#close').fadeOut("slow");
});
    }); 
</script>
<iframe style="position:absolute;width:313px;height:234px;display:none;border:0;"id="cred" name="test_creditos" src="http://img1.wikia.nocookie.net/__cb20100909154419/mario/es/images/5/54/Flor_de_Fuego.jpg" scrolling="no"></iframe>
<a class="credits" href="javascript:void(0)" id="show_credits">Cr&eacute;ditos</a>
<a href="javascript:void(0)" class="close" id="close" style="display:none;"></a>

我可以在没有iframe的情况下对Ajax或Jsonp做同样的事情吗（当我点击"Creditos"时调用并导入图像）？

我需要删除 iframe 并获得相同的结果：/

您可以使用

jQuery.get()在URL上检索文件，然后对内容执行任何操作：https://api.jquery.com/jQuery.get/

>您正在显示图像。没有必要在阿贾克斯上胡思乱想。

创建图像元素。

var image = document.createElement('img');

设置必需属性：

image.src = "http://img1.wikia.nocookie.net/__cb20100909154419/mario/es/images/5/54/Flor_de_Fuego.jpg";
image.alt = "Something suitable here";

将其添加到文档中：

document.body.appendChild(image);

相关内容

最新更新

热门标签：