javascript - 从某些链接到达时执行 jQuery

Question

我有 5 张图片(人物头像照片)。我使用以下 jQuery 在单击每个图像时显示和隐藏相应的 div(以显示有关每个人的信息)。

     $('.personDiv').hide();
     $('.listPerson').click(function(){
          $('.personDiv').hide();
          $('#person'+$(this).attr('target')).show();
          $('.listPerson').css('opacity', 0.6);
          $(this).css('opacity', 1);
     });

我希望在从其他页面上的某些链接到达时选择特定图像(并且已经显示相应的 div)，就像 href="example.html#anchor"将用户链接到特定位置一样链接页面的。我怎样才能在我的场景中实现这一点？'

非常感谢。

Answer 1

我知道如何完成类似事情的唯一方法是在其他页面的链接中使用查询字符串变量，然后在 DOM 上使用 JavaScript 解析它们并将结果存储在一个变量中，然后将其用作选择器。

如果您有这样的 URL:www.myurl.com?person=frank

$(function() {
  var params = {};
  var ps = window.location.search.split(/\?|&/);
  for (var i = 0; i < ps.length; i++) {
        if (ps[i]) {
              var p = ps[i].split(/=/);
              params[p[0]] = p[1];
        }
  }
  var personToShow = params.person;
  $('#'+personToShow).show();
});

因此，这样的内容本质上会显示 DOM 上具有 Frank ID 的任何元素。