代码之家 › 专栏 › 技术社区 › Naveed

为什么使用AJAX时浏览器的地址栏是不变的?

url zend-framework json ajax php

2

Naveed · 技术社区 · 15 年前

当我使用 http://practice.dev/ 索引.phtml 文件已加载。

<a href='http://practice.dev/index/one' class='ajax'>One</a>
<a href='http://practice.dev/index/two' class='ajax'>Two</a>

<div id="content">content comes here</div>

一个.phtml :

$jsonArray = array( 'content' => 'One' );
echo Zend_Json::encode( $jsonArray );

两个.phtml

$jsonArray = array( 'content' => 'Two' );
echo Zend_Json::encode( $jsonArray );

JS代码

jQuery(document).ready(function(){
    jQuery('.ajax').click(function(event) {
        event.preventDefault();
        jQuery.getJSON(this.href, function(snippets) {
            for(var id in snippets) {
                jQuery('#' + id).html(snippets[id]);
            }
        });
    });
});

当我单击linkone时,字符串“one”被加载到contentdiv中,但地址栏仍然是 http://practice.dev/index/one

当我单击link two时,字符串'two'被加载到contentdiv中,但地址栏仍然是 http://practice.dev/index/two

怎么可能?

谢谢

2 回复 | 直到 14 年前

1

2

Community CDub 8 年前

删除 event.preventDefault(); href

根据OP的更多信息编辑

您需要让javascript响应哈希标记。

http://practice.dev/index/one 它还需要一个hash标签版本,javascript可以这样处理 http://practice.dev/index#one . 这意味着如果有人访问该页面 http://practice.dev/index#two 您的javascript可以知道它需要去获取第二个页面,即使Zend已经获取了第一个页面。

在javascript中,可以使用

var hash = location.hash;

然后用

location.hash = "two";

here

所以保持你的链接不变 http://practice.dev/index/one 但是当用户单击链接时,可以在地址栏中添加哈希标记。如果页面加载时存在哈希标记,请更改javascript以加载特定的页码。

2

BoltClock 15 年前

这是:

event.preventDefault();

document.location.href )不会导致浏览器重定向。甚至改变碎片( document.location.hash )将导致“滚动”(取决于浏览器窗口是否小到可以滚动)。

如果你想让你的页面可以被Google索引,尽管有Ajax和Ajax修改的url, start your fragments with ! 允许Google抓取你的Ajax页面。