jquery - 带有 href# anchor 的链接不会打开 #div

标签 jquery html css anchor href

我在根据选项值打开div的站点中放置了一个选择选项列表。当您在网站中时,这效果很好。但是,如果我直接在地址栏中调用链接,例如 x.ro/y.html#3 ,它会显示 div #1 而不是 div #3.

代码如下(div id 1 为 display: none,div id 2 为 display: block):

$(function() {
  $('#articole').change(function(){
    $('.tiparticol').hide();
    $($(this).val()).show();
  });
});
<select id="articole"  onChange="window.location.href=this.value">
  <option value="#1">1</option>
  <option value="#2" select="selected">2</option>
</select>

谢谢!

最佳答案

默认情况下您不会出现此行为。您需要在加载时检查 window.location.hash 并设置适当的值。

另请注意,您应该从 HTML 中删除 onChange="window.location.href=this.value" 属性。您可以在不显眼的 jQuery change 处理程序中进行设置。试试这个:

$(function() {
  // on change
  $('#articole').change(function() {
    window.location.hash = this.value;
    setOption(this.value);
  });

  // on load
  var hash = window.location.hash.substr(1);
  if (hash)
    setOption(hash);
});

function setOption(value) {
  $('.tiparticol').hide();
  $(value).show();
}

关于jquery - 带有 href# anchor 的链接不会打开 #div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43603254/

相关文章:

css - 如何在IE10中使用css线性渐变?

jquery - Bootstrap 自定义模态效果

调整为可变图像大小的 HTML/CSS 图像框(弹出窗口)

CSS背景图片不显示

html - 从一种 HTML 表示形式转换为另一种表示形式的算法

jquery - 如何替换 HTML 标记的文本

javascript - 非图像 div 上的无限垂直滚动

javascript - HTML5 在 index.html 中导入外部本地 html 文件

javascript - jquery 域名和 url 验证

javascript - jQuery 队列不起作用