• 怎么用js设置a标签点击链接改变当前颜色


     

    怎么用js设置a标签点击链接改变当前颜色 20

    例如:多个a标签为白色,当点击其中一个a标签时改变那一个a标签的字体颜色为黄色,并且跳转到对应链接,当点击下一个a标签链接时,下一个为黄色,之前一个恢复成白色,

    我这样写的可以改变,但是当页面刷新的时候又变成白色了!
    <li><a id="a1" href="a.html" onclick="Change(this.id)">A</a></li>
    <li><a id="a2" href="a.html" onclick="Change(this.id)">B </a></li>
    <li><a id="a3" href="a.html" onclick="Change(this.id)">C</a></li>
    <li><a id="a4" href="a.html" onclick="Change(this.id)">D</a></li>
    function Change(id) {
    var OldColor='#FFFFFF';
    var a=document.getElementsByTagName("a");
    for(var i=0;i<a.length;i++)
    {
    if(a[i].id==id)
    a[i].style.color='#FF9900'; 
    else
    a[i].style.color=OldColor;
    }
    }收起
    牵说 | 浏览 8967 次  问题未开放回答 |举报
    推荐于2017-09-05 00:18:28 最佳答案
     
    改变当前颜色
    <lable id="lable1" onclick="col(1)">1</lable>
    <lable id="lable2" onclick="col(2)">2</lable>
    <lable id="lable3" onclick="col(3)">3</lable>
    <script language="javascript">
    function col(num)
    {
    for(i=1;i<6;i++)
    {
    if(i==num)
    document.getElementById("lable"+i).backgroudcolor=Red;
    else
    document.getElementById("lable"+i).backgroudcolor=Black;
    }
    }
    </script>
     
     

    du瓶邪 

    采纳率:92% 来自团队:百度知道电脑团 擅长: 电脑/网络 生活 电子数码

    其他回答

    a:visited {color: #00FF00} /* 已访问的链接 */ css搞定。
     
    追问
    这样没办法刷新,会把所有访问过的全都变成这种颜色,之前点击的不会恢复成白色
     
    追答
    你是说需要实现刷新这个功能啊 ,那需要进行本地存储了哈。可以采用cookie
     
    追问
    具体教一下呢,  没做过不知道怎么弄呢
     
    追答

    摘自W3CSchool:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    <html>
    <head>
    <script type="text/javascript">
    function getCookie(c_name)
    {
    if (document.cookie.length>0)
      {
      c_start=document.cookie.indexOf(c_name + "=")
      if (c_start!=-1)
        
        c_start=c_start + c_name.length+1 
        c_end=document.cookie.indexOf(";",c_start)
        if (c_end==-1) c_end=document.cookie.length
        return unescape(document.cookie.substring(c_start,c_end))
        
      }
    return ""
    }
     
    function setCookie(c_name,value,expiredays)
    {
    var exdate=new Date()
    exdate.setDate(exdate.getDate()+expiredays)
    document.cookie=c_name+ "=" +escape(value)+
    ((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
    }
     
    function checkCookie()
    {
    username=getCookie('username')
    if (username!=null && username!="")
      {alert('Welcome again '+username+'!')}
    else 
      {
      username=prompt('Please enter your name:',"")
      if (username!=null && username!="")
        {
        setCookie('username',username,365)
        }
      }
    }
    </script>
    </head>
     
    <body onLoad="checkCookie()">
    </body>
    </html>

    上面我想你只需要知道如何读取cookie和如何存储cookie就行了。

     本回答被网友采纳
    liangdd168  发布于2014-05-05
    举报| 评论 
    19
    静态页面无法实现 页面重新加载后js所设置的css样式无效了 可以使用cookie,页面加载的时候再设置
     
    追问
    可以举一个具体例子吗
    yeyingzimo  发布于2014-05-05
    举报| 评论 
    0
    HTML+CSS+JS,是无法保存页面状态的,如果想保存哪个网页是最后一次点击的,可以存到cookie里。页面加载的时候再读取
    lqc282545665  发布于2014-05-05
    举报| 评论 
    0
    用cookie或 web sql database(需要浏览器支持html5)
    热心网友发布于2014-05-05
    举报| 评论 
    0
    为何不用Jquery?
    宿命2711  发布于2014-05-05
    举报| 评论 
    1
    收起 其他3条回答
  • 相关阅读:
    springboot 上传文件过大的500异常
    java OSS批量下载,并压缩为ZIP
    Java 对象转xml (dom 4j)
    windows 10 64位机器上 安装部署
    Java 读取excel 文件流
    关于Java 去除空格,换行的代码
    ORACLE 查询近一天,近半小时内的数据
    【转】C#(ASP.Net)获取当前路径的方法集合
    【转】NumPy-快速处理数据
    【转】Eclipse 常用快捷键 (动画讲解)
  • 原文地址:https://www.cnblogs.com/SofuBlue/p/8047244.html
Copyright © 2020-2023  润新知