Question

我在一页上有一个过滤器。当用户进入此页面时，如果他们具有ID，我希望该过滤器触发该ID。

例如，如果id = event，我希望事件过滤器触发。

有没有更流畅的方式来显示此信息，而不是显示每个单独的ID？

例如，它在下面工作：-

    if ( document.location.href.indexOf('#events') > -1 ) {
        $(".btn.events").trigger('click'); 
    }
    if ( document.location.href.indexOf('#video') > -1 ) {
        $(".btn.video").trigger('click'); 
    }

但是如果这很流畅的话，效果会更好。我真的需要说一下URL是否具有ID，然后找到具有相同类的按钮并触发此事件。

谢谢

Answer 1

假设目标元素上的类始终与URL片段的内容匹配，那么您可以非常简单地将其通用化：

var fragment = window.location.hash;
if (fragment) {
  var target = fragment.substring(1);
  $(".btn." + target).trigger('click'); 
}

Answer 2

设置可能/允许的哈希数组，然后动态组成选择器

var myhash =  ['#events', '#video', ... ];
var hash = location.hash;

if (myhash.includes(hash)) {
   var el = $(".btn." + hash.substring(1));
   if (el.length) {
       el.trigger('click'); 
   }
}

Answer 3

不知道确切的网址格式。假设您有查询参数，此代码段将起作用。

const currentUrl = new URL(location.href);
const queryParams = currentUrl.search;
const searchParams = new URLSearchParams(queryParams);
const searchId = (searchParams && searchParams.has("id") && searchParams.get("id")) || "";
if(searchId) {
  const ele = [".btn", searchId].join(".");
  $(ele).trigger('click'); 
}

Answer 4

我的建议：

使用以下代码从网址获取ID：window.location.search，并将ID的值保存在新参数value_id中。
之后，如果value_id不为空，则可以创建常规功能：

$（“。btn。” + value_id）.trigger（'click'）;

选择具有相同URL ID的类

4 个答案: