如何在 jQuery 中引用井号 (#)？

发布于 2024-09-07 23:19:55 字数 735 浏览 4 评论 0原文

我一直在尝试一种新方法来使用 jQuery 设置网站，以便在单击链接时动态获取内容。这是 jQuery 代码：

$(document).ready(function() {

 var content_loader = $('#content-loader');

 $('#nav ul li a').click(function () {
  $(this).closest('ul').find('li.active').removeClass('active');
  $(this).parent().addClass('active');
  content_loader.load('content/' + $(this).attr('data-name') + '.html'); 
  });

 content_loader.load('content/home.html');

});

我一直这样做，因为我的网站背景中有一首歌曲，我想一直播放它，而不是每次单击链接时都重新开始。

整个事情运行得很好，除了我遇到的两个问题。

假设我单击“联系我们”链接。我现在会在网址末尾看到#contactus。如果我刷新页面，我会再次看到我的主页内容。
如果我尝试将某人链接到我的“联系我们”页面，也会出现同样的问题。

我想知道 jQuery 是否可以以某种方式找出 url 中 # 符号后面的内容。在这种情况下，我可以更改 jQuery 代码的最后一行来加载它，而不是始终加载主数据。

原文

I've been trying a new way to set up a website using jQuery to dynamically get the content when a link is clicked. Here is the jQuery code:

$(document).ready(function() {

 var content_loader = $('#content-loader');

 $('#nav ul li a').click(function () {
  $(this).closest('ul').find('li.active').removeClass('active');
  $(this).parent().addClass('active');
  content_loader.load('content/' + $(this).attr('data-name') + '.html'); 
  });

 content_loader.load('content/home.html');

});

I've been doing it this way since I have a song in the background of my site that I want to play all the time and not start over every time a link is clicked.

The whole thing works pretty good, except for 2 issues I'm having.

Let's say I click the contact us link. I would now see #contactus at the end of the url. If I then refresh the page, I see my home page content again.
Same problem if I try linking someone to my contact us page.

I was wondering if jQuery can somehow find out what comes after the # sign in the url. In that case, I can change the last line of my jQuery code to load that instead of the home data all the time.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

情何以堪。 2024-09-14 23:19:55

window.location.hash 将包含哈希值后的值（如果有）。 （这是当浏览器地址栏中当前网址（例如当前页面）中有哈希值时的情况。）

否则，如果您正在从 href 读取链接，则需要使用indexOf('#') 和一些解析。

回复收藏 0 原文

暮光沉寂 2024-09-14 23:19:55

谢谢你们的回答。我现在就是这样做的：

$(document).ready(function() {

    var content_loader = $('#content-loader');

    $('#nav ul li a').click(function () {
        $(this).closest('ul').find('li.active').removeClass('active');
        $(this).parent().addClass('active');
        content_loader.load('content/' + $(this).attr('href').slice(1) + '.html');  
        });

    var initial = 'home';
    if (window.location.hash) {
        initial = window.location.hash.slice(1);
        }

    $('#nav').find('a[href="#' + initial + '"]').parent('li').addClass('active');
    content_loader.load('content/' + initial + '.html');

    });

Thanks for your answers guys. This is how I did it now:

$(document).ready(function() {

    var content_loader = $('#content-loader');

    $('#nav ul li a').click(function () {
        $(this).closest('ul').find('li.active').removeClass('active');
        $(this).parent().addClass('active');
        content_loader.load('content/' + $(this).attr('href').slice(1) + '.html');  
        });

    var initial = 'home';
    if (window.location.hash) {
        initial = window.location.hash.slice(1);
        }

    $('#nav').find('a[href="#' + initial + '"]').parent('li').addClass('active');
    content_loader.load('content/' + initial + '.html');

    });

回复收藏 0 原文

~没有更多了~