如何使用AJAX作为iframe的替代方案？

此刻，我在我的网站上使用iframe来显示来自其他页面的内容，例如表单。我遇到的问题是在登录页面上，当用户使用iframe内的表单登录时，它仅显示登录iframe中的下一页 - 这完全没用。如何使用AJAX作为iframe的替代方案？

我听说AJAX对于像这样的事情来说更加灵活和动态，但我无法弄清楚如何使用它，我已经看过一些教程，但似乎没有得到那么远的显示页面内的页面。

如何用AJAX替换我的iframe？

预先感谢:)

2012-04-29 Lissy

既然你不会使用iFrame中，您将需要一个容器来把你的页面进入。使用AJAX，通常使用<div>元素来保存该数据。另外，支持AJAX的jQuery或其他Javascript库将使您的工作更轻松，并且可以使用经过测试的代码，因此您可以专注于业务逻辑而不是基本内容。所以，在你的HTML，您将需要一个容器元素：

<div id="otherpage"></div>

然后在包括JavaScript文件，你可以使用这个jQuery的：

$(document).ready(function() { 
    $('#otherpage').load('otherpage.html', function() { 
     alert('Load was performed.'); 
    }); 
});

当然，使用前，请确保您也包括jQuery。 This tutorial应该可以帮助您开始使用jQuery。

来源

2012-04-29 12:13:03

感谢，这正是我试图做的，并解释清楚真的谢谢你:) X – Lissy 2012-04-29 13:31:26

我只是发现这一点，并认为这只是代表的事情花边一些iframes。我将代码复制到我的页面和Bang！它第一次工作完美。然后我试图点击我的'otherpage'中的一个按钮，它不起作用。该按钮还可以运行一些jQuery。我想要做不可能的事情吗？或者这只是我错过的一个微不足道的小问题？ – TrapezeArtist 2013-11-17 18:12:58

刚刚看到这个评论4年后，因为有人upvoted。为了回答未来的读者，当您动态加载HTML内容时，您需要确保您的jquery绑定位于文档中，而不是元素上。例如：'$（document）.on（'click'，'.my-button'，myHandler）;'而不是'$（'。my-button'）。on（'click'，myHandler）;' – 2017-05-24 13:03:30

您面临的问题与其他任何事情相比，更多地涉及到ajax。

尝试在主机html（不是通过ajax加载的）中“预加载”你的js函数，并通过ajax加载特定的呈现html。

然后，使用jquery“.done（函数（数据）{...”）方法来调用js函数“预先加载”< <（包含在基本html /文档中）。。

希望这有助于，问候

尝试是这样的：。

 

    $(document).ready(function(){ 
     $.ajax(
      url : './your_script.php', 
      context: 'document', 
     ).done(function(data){ 
      $('#your_div').html(data); 
      your_js_function(); 
     }) 
    }); 

    // ---- main html 
    function your_js_function(){ 
     alert('got it!'); 
    };

来源

2014-05-18 21:51:54 jjyepez

如何使用AJAX作为iframe的替代方案？

回答

相关问题