根据网址显示特定的div或内容

时间:2019-07-03 10:08:39

标签: javascript jquery

我希望能够显示一个div,其中包含一些特定于URL的内容。 因此,仅在包含指定URL的页面上显示div,例如:

如果URL等于以下任意一项:

/makeup/face/foundation/compact-loose-powder/luminous-silk-compact-case/3614270283604.html
/makeup/face/foundation/liquid-foundation/designer-lift-foundation/3605521491268.html
/makeup/face/foundation/liquid-foundation/power-fabric-foundation/ww-00049-arm.html
/makeup/face/foundation/liquid-foundation/maestro-fusion-makeup/AP10123.html
/makeup/face/foundation/face-fabric/ww-00115-arm.html

显示以下div:

<div class="container-content">content</div>

否则将其隐藏。

我尝试了以下失败的尝试:

 var paths = ['/makeup/face/foundation/compact-loose-powder/luminous-silk- 
 compact-case/3614270283604.html', '/makeup/face/foundation/compact-loose- 
 powder/luminous-silk-compact-case/3614270283604.html', '/makeup/face/foundation/liquid-foundation/power-fabric-foundation/ww-00049-arm.html', '/makeup/face/foundation/liquid-foundation/maestro-fusion-makeup/AP10123.html', '/makeup/face/foundation/face-fabric/ww-00115-arm.html'];
 $('.container-content').toggle(paths.indexOf(location.path) != -1);

2 个答案:

答案 0 :(得分:1)

您不需要正则表达式。将本地路径放入数组中,然后测试以查看当前位置是否与这些路径中的任何一个相符:

var paths = ['/en-us/mens/designers/brunello_cucinelli', '/en-us/mens/grooming', '/en-us/mens/shoes'];
$('.container-content').toggle(paths.indexOf(location.path) != -1);

答案 1 :(得分:0)

这不再需要使用jQuery作为Liquid对象请求检索当前路径: https://help.shopify.com/en/themes/liquid/objects/request

这应该可以解决问题:

{%- capture urls -%}
/makeup/face/foundation/compact-loose-powder/luminous-silk-compact-case/3614270283604.html, /makeup/face/foundation/liquid-foundation/designer-lift-foundation/3605521491268.html, /makeup/face/foundation/liquid-foundation/power-fabric-foundation/ww-00049-arm.html, /makeup/face/foundation/liquid-foundation/maestro-fusion-makeup/AP10123.html, /makeup/face/foundation/face-fabric/ww-00115-arm.html
{%- endcapture - %}

{% if urls contains request.path %}
<div class="container-content">content</div>
{% endif %}