2016-05-10 35 views
4

这是使用AJAX我第一次我已经在它读了,也是我第一次用JS这样一种动态地创建网页。我想我一直在困惑自己。PHP/JS/AJAX/HTML:

我试图动态地创建一个新的餐厅网页,所以管理员点击按钮的onclick新网页创建的每个时间,与新的餐厅网页,我已经创建的内容。

目前我已经得到尽可能按下一个按钮,一个新的网页成功创建,但是,我不知道如何访问新的网页,我也想显示一个链接到新创建的网页作为它被创建,例如之前使用。例如在js中显示我的点按钮之前的动态功能。

HTML

<html> 
<body> 
<button onclick="makePage()">click</button> 
<script src="makePage.js"> 
</script> 
</body> 
</html> 

JS

function makePage(){ 
var xmlhttp = new XMLHttpRequest(); 
xmlhttp.onreadystatechange = function(){ 
if(xmlhttp.readyState==4 && xmlhttp.status==200) 
    alert("webpage " + xmlhttp.responseText + " was successfully created!"); 
} 
var content = "<html><head><meta charset=\"utf-8\" /> </head><body>new website<script>alert(\"test\")</script></body></html>"; 
xmlhttp.open("GET","makePage.php?content=" + content,true); 
xmlhttp.send(); 

}

PHP

<?php 
$content = $_GET["content"]; 
$file = uniqid() . ".html"; 
file_put_contents($file, $content); 
echo $file; 
?> 

有什么建议?指导或相关页面,我可以阅读。任何事情都将非常感激。

回答

2

在你的js做这样的事情,而不是警报:

if(xmlhttp.readyState==4 && xmlhttp.status==200){ 
    var createA = document.createElement('a'); 
    var createAText = document.createTextNode(xmlhttp.responseText); // or whatever name you need 
    createA.setAttribute('href', xmlhttp.responseText); 
    createA.appendChild(createAText); 
    document.body.appendChild(createA); // or you can create some <div> or whatever and append it to that 
} 

这是普通的JavaScript,但使用jQuery你可以用ajaxget功能做更容易。

+0

太好了!看着它,它看起来像我在找什么。谢谢你抽出时间。我会稍后再尝试一下,以及看看你提供的链接 – jerneva