jquery - Hubspot JQuery 添加活动类不起作用
问题描述
我正在尝试创建一个带有“活动”类的 Hubspot 自定义菜单模块,但是当我使用 URL 作为 href 时它不起作用。当我单击链接时,页面刷新并且“活动”类不会改变。当我使用 HUBL+HTML 时,我不确定我是否做得正确
<script type="text/javascript">
$('.listing-menu a').on('click', function() {
var h = $(this);
h.parents('.listing-menu').find('li').removeClass('active');
h.parentsUntil('.additional-menu', 'li').addClass('active');
})
</script>
.listing-menu-item {
width: fit-content;
float: left;
padding: 20px 25px;
}
a#listing-menu-items {
text-decoration: none;
color: #93a1af;
}
.active {
background: white;
}
.listing-page-menu li{list-style:none; display: inline;}
<div class="listing-page-menu" id="menu">
<ul class="listing-menu" id="listing-menus">
<li class="listing-menu-item active"><a id="listing-menu-items" href="/blog/"> <h5>Most Recent</h5></a></li>
<li class="listing-menu-item"><a id="listing-menu-items" href="/blog/tag/tag1/"> <h5>Tag 1</h5></a></li>
<li class="listing-menu-item"><a id="listing-menu-items" href="/blog/tag/tag2/"> <h5>Tag 2</h5></a></li>
<li class="listing-menu-item"><a id="listing-menu-items" href="/blog/tag/tag3/"><h5>Tag 3</h5></a></li>
<li class="listing-menu-item"><a id="listing-menu-items" href="/blog/tag/tag4/"> <h5>Tag 4</h5></a></li>
<li class="listing-menu-item"><a id="listing-menu-items" href="/blog/tag/tag5/"> <h5>Tag 5</h5></a></li>
</ul>
</div>
解决方案
检查此代码:
{% for item in my_topics %}
<li>
<a class="{% if item.slug == topic %} active {% endif %}" href="{{ blog_tag_url(group.id, item.slug) }}">{{ item }} </a>
</li>
{% endfor %}
希望能帮助到你。乐意效劳。
推荐阅读
- python - Python在DataFrame中添加和排序新行
- vue.js - 让所有 Vue 组件都可以使用一个变量,而无需通过 props 显式传递它?
- wordpress - 将已上传的图片设置为 WordPress 中帖子的特色图片
- javascript - Node C++ 插件持久化 JS 回调供以后使用
- javascript - 如果语句未执行。(MongoDB/JS)
- html - 在其中提交表单时关闭角度下拉列表
- android - 在 21 岁以下的 Android 中使用 ?attr 失败
- laravel - 应用程序 API 客户端的用户?
- reactjs - 带有 CRA 的 AMP 页面
- python - 从python中的网页获取文本