Question

请参阅我创建的jsfiddle演示here，我正在尝试为当前客户的网站添加深层链接功能。

我需要以下要求的帮助：

我的简单点击toggleClass代码：

$("div.contentBox").click(function () {

    var $this = $(this);
    // don't proceed if already selected
    var $previousSelected = $('.selected');
    if ( !$this.hasClass('selected') ) {
        $this.addClass('selected');
    }

    $previousSelected.removeClass('selected');  
});

（1）会有许多重复的<div class='contentBox'>，每个都有不同的属性值title=''

（2）通过$("div.contentBox").click()添加来自title=''的值的事件触发器，会产生类似 http://site.com/index.html#content01-about-us 的内容。注意：请提供样本编码如何实现此目的。

（3）通过<div>阻止而非<a>触发事件的原因是由于容器<a>内的其他class='contentBox'标记，最终会形成嵌套{ {1}}链接，这是不允许的。

（4）<a>也将toggleClass'选中'

（5）从链接返回，例如 http://site.com/index.html#content01-about-us ，页面加载将足够聪明，可以$("div.contentBox").click()为addClass / toggle class <div class='contentBox' title='content01-about-us>

我花了好几周的时间来搞清楚这一点，但无济于事，在这里迫切需要帮助。如果有人愿意根据要求更新上述jsfiddle demo，那将是最好的。

我自己经过了一些研究，遇到了history.js，address.js和BBQ plugin，但却无法让它发挥作用

非常感谢提前

Answer 1

你需要这样的东西：

$("div.contentBox").click(function () {

var $this = $(this);
// don't proceed if already selected
var $previousSelected = $('.selected');
if ( !$this.hasClass('selected') ) {
    $this.addClass('selected');
}
$previousSelected.removeClass('selected');  

if(location.href.indexOf('#') == -1)
  location.href += "#" + $(this).prop("title");
else
  location.href = location.href.split('#')[0] + "#" + $(this).prop("title");
alert(location.href);
});

第二个要求：

$(document).ready(function() {
  if(location.href.indexOf('#') != -1){
    var page = location.href.split('#')[1];
    $("div[title*=" + page + "]").addClass('selected');
  }
});

通过<div>块和属性title =''以及toggleClass'选择'</div>进行深层链接

1 个答案: