通过ajax用HTML文件填充div
[英]fill div with html file via ajax
问题描述
I have a div on my main html file; 
我的主要html文件上有一个div；
<div id="content"></div>
and two html files: login.html & singup.html. 和两个html文件：login.html和singup.html。
Also a navigation bar is present on the top of my page. 页面顶部也有一个导航栏。 Is it possible to fill the content of the div with the use of AJAX with the content of the login file when the login button is clicked and fill it with singup.html when the register button is clicked? 单击登录按钮时，是否可以使用AJAX和登录文件的内容填充div的内容，单击注册按钮时，可以使用singup.html填充div的内容？
these are the buttons: 这些是按钮：
<li><a href="#">Login</a></li>
<li><a href="#">Register</a></li>
2 个解决方案
解决方案1
2 已采纳 2013-03-11 12:43:50
Just get the responeText of the request and set the div.innerHTML = AJAX.responseText; 刚拿到responeText请求，并设置div.innerHTML = AJAX.responseText; . 。
If your login.html page built as a stand-alone page, I mean, contains <html><head></head><body>...</body></html> tags - you might want to add just the inner content of the <body> tag. 如果您将login.html页面构建为独立页面，则意味着包含<html><head></head><body>...</body></html>标签-您可能只想添加<body>标签的内部内容。 You can use regexp to get it: 您可以使用regexp来获取它：
div.innerHTML = AJAX.responseText.replace( /<body>([\s\S]*)<\/body>/i , "$1" );
解决方案2
-1 2015-03-23 04:24:28
Here's a small library that will fill an element with the HTML response of an ajax call using simple markup; 这是一个小库，它将使用简单标记将ajax调用的HTML响应填充到元素中； no need to write any JS. 无需编写任何JS。
https://github.com/grimmdude/jquery-ajax-markup https://github.com/grimmdude/jquery-ajax-markup
<div data-ajax-url="http://example.com/api/product" data-ajax-type="html"></div>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.