我试图了解如何使用jQuery地址插件来处理与ajax的深层链接.
但文档很差,我找不到任何好的教程来解释发生了什么.
我认为一个包含好例子的好文档对每个插件都很重要.
有人可以解释或提供一些有用的链接来解释吗?
$.address.change(function(event) {
// do something depending on the event.value property, e.g.
// $('#content').load(event.value + '.xml');
});
$('a').click(function() {
$.address.value($(this).attr('href'));
});
Run Code Online (Sandbox Code Playgroud)
我的意思是,做$.address.value
什么?它说"提供当前的深层链接价值." 它甚至意味着什么?它有什么作用呢?
这是我使用jQuery Address的第二个项目,我认为Firefox有些奇怪,或者至少我可以发现它在Firefox和Webkit中有不同的行为.
深度链接时,jQuery Address应触发change事件并执行与此状态相关的JavaScript.
对于/ foo/bar深层链接,如果我将事件对象写入控制台,在Google Chrome中,我有两个事件被触发:
jQuery.Event#1
path: "/"
pathNames: Array[0]
queryString: ""
timeStamp: 1335431580471
type: "change"
value: "/"
Run Code Online (Sandbox Code Playgroud)
jQuery.Event#2
path: "/foo/bar"
pathNames: Array[2]
queryString: ""
timeStamp: 1335431580471
type: "change"
value: "/foo/bar"
Run Code Online (Sandbox Code Playgroud)
但是在Firefox中,我只触发了一个事件,它没有考虑当前的URI:
jQuery.Event#1
path: "/"
pathNames: Array[0]
queryString: ""
timeStamp: 1335431580471
type: "change"
value: "/"
Run Code Online (Sandbox Code Playgroud)
很明显在Firefox中,我想为/ foo/bar URI打开的灯箱永远不会打开:-(
这是我的jQuery地址代码:
$.address.crawlable(1).state('/').change(function(event) {
var page = event.path;
if (page == '/foo/bar'){
openLightbox($('#create-popup-template').html());
create_main();
}
});
Run Code Online (Sandbox Code Playgroud)
现在我使用一个简单的解决方法使其在Firefox中工作,只需添加一个init函数来强制在Firefox中进行第二次更改事件:
$.address.init(function(){
if ($.browser.mozilla)
$.address.value(window.location.pathname);
});
Run Code Online (Sandbox Code Playgroud)
但这是我第二次这样做,感觉不对..我错过了什么吗?
我也已经试图搞砸了内部和外部的变化回调,没有机会..
谢谢你的帮助,
托马斯.
类似问题有很多线索,但据我所知,这个问题是独一无二的.
我在我的应用程序中使用jQuery Address插件,并希望在TypeScript文件中使用它.遗憾的是,该库没有可用的DefinitelyTyped脚本.当我尝试使用jQuery.address时,我得到:
The property 'address' does not exist on value of type 'jQueryStatic'
Run Code Online (Sandbox Code Playgroud)
根据这个帖子,我试图在address
里面定义jquery.d.ts
:
interface JQueryStatic {
address(options): any;
...
}
Run Code Online (Sandbox Code Playgroud)
我认为这似乎适用于$ .address(); 但不适用于任何地址的方法.我也尝试过这个帖子创建自己的.d.ts文件,但仍然没有运气.我尝试declare
在.d.ts文件中使用.没运气.
我需要使用的唯一方法是parameter
方法......
$.address.parameter('param', 1);
Run Code Online (Sandbox Code Playgroud)
在这种情况下,我得到:
The property 'parameter' does not exist on value of type 'address'
Run Code Online (Sandbox Code Playgroud)
关于如何解决这个问题的任何想法?
编辑:我在Visual Studio C#.net环境中工作,如果有帮助的话.
编辑3:这个jsFiddle适用于插件,我几乎拥有它.
编辑2:我做了一个小提琴.我无法让插件在那里工作,但也许它更容易分析.
在我正在构建的网页中,通过Ajax加载文章(帖子)和新页面.在加载新的Ajax内容的同时,地址栏会发生变化(使用jQuery Address插件).
所以正常的导航会像这样:
//page2/page3/article7/page3/page4
请注意,在此导航中,没有按下任何浏览器按钮,退出文章7时,网站返回到其先前的URL,在这种情况下是page3.
当用户按下后退或前进按钮时,插件不会检测到.我设法找出了一种方法来了解用户何时按下后退或前进按钮:
每次添加新内容并更改地址时,我都会将新地址存储在一个数组中.如果用户按下后退或前进按钮,我会这样分析:
if(new_url == penultimate_value_in_array)=>按下后退按钮(从数组中删除最后一个值)
else =>按下前进按钮(向数组添加新值)
这适用于这种导航:
//page2/page3/page4
在我的情况下,它适用于后退按钮.但是,如果用户从/ article7按下Forward到/ page3,该函数会将其读作Back.这是一个了解我的意思的例子:
用户在/ page4并按Back - > new_page =/page3等于penultimate_page_in_array(/ page3)=> BACK
//page2/page3/article7/page3/page4
用户在/ page3并按Back - > new_page =/article7等于penultimate_page_in_array(/ article7)=> BACK
//page2/page3/article7/page3
user在/ article7中并按Back - > new_page =/page3等于penultimate_page_in_array(/ page3)=> BACK
//page2/page3/article7
用户在/ page3中按Back - > new_page =/page2等于penultimate_page_in_array(/ page2)=>返回
//page2/page3
user在/ page2中并按下Forward - > new_page =/page3,它不等于penultimate_page_in_array(/)=> FORWARD
/ /第2页
user在/ page3中并按下Forward - > new_page …
我正在改变网站的一大部分,以使用jQuery Address'深度链接AJAX功能.我正在使用URI之类的东西mysite.com/#!/page1/subpage/
.
我已经阅读了关于使用该_gaq.push()
功能跟踪流量的一些信息,但我想知道是否有可能以更传统的方式进行...
每个AJAX请求调用一个PHP函数,该函数构建一个页面并将其返回到<HTML>
包装器中,这样我就可以轻松定义自定义页面标题等等.
如果我将分析代码放在该页面上,jQuery调用该页面会触发它来跟踪访问吗?
我正在使用 jquery 地址插件加载页面,但没有哈希(#)。
索引.html:
<a href="page.html">Link</a>
<div id="content">
<script>
$(document).ready(function() {
$.address.init(function(event) {
$('a').address();
}).change(function(event) {
// do something depending on the event.value property, e.g.
console.log(event.value);
$.ajax({
type: "POST",
url: event.value,
success: function(msg){
$('#content').html( $(msg).find("#content").html() );
}
});
});
$('a').click(function(e) {
$.address.value($(this).attr('href'));
});
});
</script>
</div>
Run Code Online (Sandbox Code Playgroud)
页面.html:
<div id="content">
<p>text</p>
<script>
$(document).ready(function() {
alert('loaded');
});
</script>
</div>
Run Code Online (Sandbox Code Playgroud)
在#content div 中将从page.html 加载#content html(也许我应该使用其他函数,而不是.html(),请纠正我),在那个div 中是脚本标签,但是在加载该页面时我没有收到警报从 ajax,它可以在没有 ajax 加载的情况下工作。有人能帮我吗 ?
编辑:当我尝试单击带有 js 函数的链接时出现此错误:
XMLHttpRequest cannot load javascript:;. Cross origin requests are only supported …
我正在开发一个应该支持移动和桌面设备的网站.我正在使用jquery-address插件来创建一个可以使用哈希标签进行深度链接的图库.
但我注意到ipad模拟器中有iOS5和iphone 5的问题,我必须在图像库中单击图像库中的两个类别才能使事件正常工作.只需单击一下,它就可以在OSX上的chrome/safari/firefox上正常工作.
到目前为止我只在iphone/ipad上看过这个. 关于为什么桌面浏览器只需点击一下即可正常工作的想法,但ipad/iphone上的iOS需要两个? 我在这里不知所措.我无法分辨问题是我的标记/ javascript还是iPad/iPhone上的jquery-address/safari中的一个模糊的错误.
从文档(http://www.asual.com/jquery/address/docs/)中可以看出,该插件有一个事件可以检测何时按下浏览器的后退/前进按钮.
$ .address.externalChange(FN)
我的问题是,是否有办法知道何时按下背部以及何时按下前进.例如,这将适用于两种情况:
$.address.externalChange(function() { console.log('back/forward pressed'); });
Run Code Online (Sandbox Code Playgroud)
谢谢.
我见过的大多数jquery深层链接插件都要求我将"#"附加到我的链接上.这是一个例子:
<a href="#page1.html">Page 1</a>
Run Code Online (Sandbox Code Playgroud)
即使Twitter的这是否(但是,微博遵循使用抓取链接的谷歌规范#!
,这也是由像jQuery烧烤和jQuery jQuery的地址深层链接库支持).
我用新的Twitter关闭了Javascript,但它不起作用.我问这个问题是否可以应用深层链接,即使使用Javascript关闭也仍然有一个功能性网站.
提前致谢!
javascript jquery deep-linking fragment-identifier jquery-address
我正在尝试jQuery地址http://www.asual.com/jquery/address/
在click事件中,我设置$ .address.value(mypath);
这会触发$ .address.change()事件.
当我单击链接时,我希望行为与通过单击后退/前进按钮或书签或链接触发此事件略有不同.
有没有办法区分这两个事件.我查看了传递给$ .address.change()的事件对象,它们在两种情况下似乎都是相同的.
我正在尝试使用http://www.asual.com/jquery/address/中的Address插件,我真的需要能够访问点击的链接或对象,触发$ .address.change函数.
所以基本上,我有一个看起来像这样的链接:
<a href="#" class="active" rel="address:/show-my-activity">Activity</a>
Run Code Online (Sandbox Code Playgroud)
然后我有$ .address.change函数,如下所示:
<script language="javascript">
$.address.internalChange(function (e) {
// this is where I need to get the obj of what was clicked to trigger it
// find out what the e.value is, and do the ajax needed
});
</script>
Run Code Online (Sandbox Code Playgroud)
我已经遍历了"e"的所有属性,但我找不到任何引用我的东西回到被点击的对象.这是从"e"变量返回的内容......
undefinedtype value :change
timeStamp value :1317227369056
jQuery1317227368799 value :true
value value :/show-my-activity
path value :/show-my-activity
pathNames value :show-my-activity
parameterNames value :
parameters value :[object Object]
queryString value :
result value :undefined
target …
Run Code Online (Sandbox Code Playgroud) 我正在寻找一个好的pushstate jquery插件来使用ajax-json(和js关闭时的php的mod_rewrite)并找到jQuery Address.我非常喜欢它,因为它有很好的文档记录并且易于使用.(我从来没有真正弄清楚history.js)我注意到,伟大的互联网浏览器(9)在href字段中放置了哈希.它也是在示例中做到的:http://www.asual.com/jquery/address/samples/state/contact我已经测试了其他浏览器,但你只能通过优秀的Internet Explorer看到这一点.有什么方法吗?
一旦新内容加载,我如何使已经加载的内容淡出,然后这个新内容淡入.
我正在使用jquery地址尝试实现这一点,如果它更容易/更好用另一个插件请建议一个:-)
我的代码如下:
function loadURL(url) {
console.log("loadURL: " + url);
$("#content").load(url);
}
$.address.init(function(event) {
console.log("init: " + $('[rel=address:' + event.value + ']').attr('href'));
}).change(function(event) {
$("#content").load($('[rel=address:' + event.value + ']').attr('href'));
console.log("change");
})
$('a').click(function(){
loadURL($(this).attr('href'));
$("#content").hide();
$("#content").fadeIn();
});
Run Code Online (Sandbox Code Playgroud)
我确实尝试过,我认为我可能会创建一个加载器div,我会淡出顶部而不是淡出内容,但我真的不知道该去哪里.
当内容淡入时,一旦你点击另一个链接,它就会变成新内容,也会淡入它,但我不知道在新内容消失之前我是如何让它淡出的.
任何帮助将不胜感激!
jquery-address ×13
jquery ×12
ajax ×5
javascript ×4
deep-linking ×3
back-button ×1
click ×1
firefox ×1
html ×1
mobile ×1
plugins ×1
pushstate ×1
safari ×1
typescript ×1