更改网页的内容而不更改URL
我想制作一个简单的网站,用户可以在其中输入其名称。但我不知道我该如何做到这一点。更改网页的内容而不更改URL
这是我想要的。
在我的index.php
中,会出现一个input
,它允许用户键入他们的姓名。用户单击按钮后,我希望用户留在index.php
但内容不同。 我可以做网站哪个文本框和按钮。但是我不知道用户点击按钮后应该怎么做。
不明白我的意思吗? 例如,这是Facebook登录页面。
登录后,
我们仍然在同一个页面(的index.php),但内容改变。我知道如何制作网站,但我不知道如何在不更改网址的情况下更改内容(例如www.example.com/index.php?u=blah,我只想要www.example.com/index.php)
任何人都可以提供一个关于如何做到这一点的例子/想法?先谢谢了。 对不起,我的英语不好。
编辑:对不起,我的英文不好。其实我的意思是,同一个网址但内容不同。我使用Google搜索,我认为cookie
是最好的解决方案。
你需要使用AJAX:
AJAX允许网页通过交换少量数据与后台服务器异步更新。这意味着可以更新网页的某些部分,而无需重新加载整个页面。
我认为这是没有多大用处的给这里的AJAX教程,但你可以阅读w3school's AJAX tutorial。 如果你了解基础知识,我会建议使用jQuery,一个JavaScript库,它比纯JavaScript更简单。
请参阅上面的修改。 – Jeremy 2014-11-02 05:42:09
您需要使用AJAX进行内容更新,而无需重新加载网页。
JS代码:
<script type="text/javascript">
$(document).ready(function() {
var track_load = 0; //total loaded record group(s)
var loading = false; //to prevents multipal ajax loads
var total_groups = <?php echo $total_groups; ?>; //total record group(s)
$('#results').load("autoload_process.php", {'group_no':track_load}, function() {track_load++;}); //load first group
$(window).scroll(function() { //detect page scroll
if($(window).scrollTop() + $(window).height() == $(document).height()) //user scrolled to bottom of the page?
{
if(track_load <= total_groups && loading==false) //there's more data to load
{
loading = true; //prevent further ajax loading
$('.animation_image').show(); //show loading image
//load data from the server using a HTTP POST request
$.post('autoload_process.php',{'group_no': track_load}, function(data){
$("#results").append(data); //append received data into the element
//hide loading image
$('.animation_image').hide(); //hide loading image once data is received
track_load++; //loaded group increment
loading = false;
}).fail(function(xhr, ajaxOptions, thrownError) { //any errors?
alert(thrownError); //alert with HTTP error
$('.animation_image').hide(); //hide loading image
loading = false;
});
}
}
});
});
</script>
HTML代码:
<ol id="results"></ol>
<div class="animation_image" style="display:none" align="center"><img src="ajax-loader.gif"> </div>
你可以找到完整的教程here。
请参阅上面的修改。 – Jeremy 2014-11-02 05:41:26
您需要为它使用AJAX。首先,创建一个收集表单数据的页面,然后在索引页面中使用AJAX加载另一个提交页面。您可以检查https://github.com/jobayerccj/Simple-Admin-Panel-using-PDO-AJAX,我已经使用AJAX创建了一个管理面板,其中我使用AJAX加载了内部页面而不更改链接。
您可以使用PHP来做到这一点,这是我为我所有的网站做的这只是一个想法,不知道它是否正是你正在寻找或不是,但这是一个链接到我目前的网站如果你想看到它的生活。请务必在点击网站顶部的链接时检查网址。http://www.thedecoy.net
因此,在您的index.php页面中,您将拥有您的基本html代码,包括css和图片,或者您希望在所有网站上显示的网站上使用的任何其他内容, div标签你可以做这种类型的PHP代码。
<?php
error_reporting(E_ALL^E_NOTICE);
function open_page($string){
if (preg_match("/^[a-zA-Z]+$/", $string)){
$string = $string;
}else{
$string = "";
}
return $string;
}
$page = open_page($_GET['page']);
if ($page){
$file = "pages/".$page.".php";
if (file_exists($file)){
$pagename = $page;
}else{
$pagename = "404";
}
include("pages/".$pagename.".php");
}else{
echo 'Anything you want displayed in the content of your main page would go here';
}
?>
你会创建一个名为在根文件夹“页面”目录下的index.php文件是然后在这里面,你可以创建其他页面,例如about.php,contact.php ECT我相信你得到的重点,在这些文件中,你只会放置你想要显示的内容,这样你就不需要所有的HTML头体或任何你想要的内容div本身。
比方说您想链接用户访问您的网站的contact.php文件,你会简单地链接调用像这样。
<a href="index.php?page=contact">Contact</a>
这将保持index.php加载,但将内容更改为contact.php信息。 该代码有点草率,并从我的网站本身拉,所以你可能需要处理一些事情。
放入页面404.php页文件夹,如果一个页面没有找到,所以如果他们进入了一个不存在的链接访问者就会看到该网页,这将被调用。
不知道如果我留下什么东西出来,但请随时问,如果这可以帮助你。
你必须使用JavaScript来做到这一点。 PHP在页面刷新时在服务器上运行。 – Barmar 2014-11-02 05:22:40
您将要使用'GET'而不是'GET'。 – 2014-11-02 05:25:39