如何更改jQuery手机头部中的元素？
如何更改jQuery手机头部中的元素？
提问于 2019-04-18 06:27:34
我正在使用jQuery Mobile1.4.5，并试图更改标题中元素的链接颜色。由于jQuery手机的行为，它不会再次加载头部来创建平滑的体验，颜色不会改变。
异常，如果我添加data-ajax="false"，那么它就会改变。但应该有一种方法来避免这种情况。
标题中的我的导航：
<nav>
<a href="/test/" id="nav_test" class="ui-link">TEST</a>
<a href="/other/" id="nav_other" class="ui-link">OTHER</a>
</nav>将活动链接的颜色设置为红色的jQuery代码：
$( document ).ready(function() {
console.log('nav_' + window.location.pathname.split('/')[1]);
$('#nav_' + window.location.pathname.split('/')[1]).css('color', '#7e000b');
});如果我将data-ajax="false“添加到a href标记中，这将起作用。
如何在不重新加载整个标题的情况下设置颜色？
回答 1
Stack Overflow用户
发布于 2019-04-18 07:05:41
试试这个:)
$().ready(function(){
let location = window.location.pathname.split('/')[1];
$('.ui-link').css('color', 'rgb(0, 0, 238)'); // reseting colors of all links
switch (location) {
case "test":
$("#nav_"+location).css('color', '#7e000b')
break;
case "other":
$("#nav_"+location).css('color', '#7e000b')
break;
default:
}
// onclick handler in case you arent doing an actual redirect (onepager)
$('.ui-link').click(function(){
location = $(this).id.split('_')[1];
$('.ui-link').css('color', 'rgb(0, 0, 238)'); // reseting colors of all links
$(this).css('color', '#7e000b'); // updating this link color
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<nav>
<a href="/test/" id="nav_test" class="ui-link">TEST</a>
<a href="/other/" id="nav_other" class="ui-link">OTHER</a>
</nav>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55736784
复制相关文章
相似问题