突出显示< li>点击元素并在页面加载后保持突出显示 [英] highlighting a <li> element on click and keeping it highlighted even after page load

问题描述

您好，我将css应用于位于母版页中

标签内的列表元素之一。所以当我点击这个链接风格得到应用，但页面重新加载，然后应用的样式再次重置为默认这是我的代码可以有人帮助我呢？请问？

 函数SelectThis（ctrl）{
 debugger; 
 var list = document.getElementById（myslidemenu）。getElementsByTagName（'a'）; 
 
 for（i = 0; i< list.length; i ++）{
 list [i] .style.color =white; 
 list [i] .style.background =＃414141; 
} 
 ctrl.style.background =black; 
 ctrl.style.color ='yellow'; 
} 
  

但是因为我点击超链接。主页面重新加载并且所选样式丢失

解决方案

由于它是一个超链接，位于< li> 使用

e.preventDefault（）;将停止< a> 标签的默认操作 更新：

list [i] .addEventListener（'click'，preventReload）;

  function preventReload（e）{
 e.preventDefault（）; 
} 
  

将这段代码添加到for循环中，这将停止超链接即停止重新加载页面。

hi i am applying css to one of my list elements which is inside a

tag which is in a master page. so when i click this link the style is getting applied but the page reloads and then the applied style is again reset to default this is my code can somebody help me with this? please?

 function SelectThis(ctrl) {
        debugger;
        var list = document.getElementById("myslidemenu").getElementsByTagName('a');

        for (i = 0; i < list.length; i++) {
            list[i].style.color = "white";
            list[i].style.background = "#414141";
        }
        ctrl.style.background = "black";
        ctrl.style.color = 'yellow';
    }

but since i am clicking on a hyper link. the master page reloads and the selected styles are lost

解决方案

Since it is a hyper link is residing inside the <li> use

e.preventDefault(); will stop the default action of the <a> tag

Update:

list[i].addEventListener('click',preventReload);

function preventReload(e){
    e.preventDefault();
}

Add this code inside the for loop, which will stop the default functionality of the hyperlink i.e., stops the page from reloading.

这篇关于突出显示< li>点击元素并在页面加载后保持突出显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！