Question

when we click on anchor tag it got hover but its not working for the visited function like if we visit to that link it should change its color and then if we visit to second link the color of first link should revert to its previous color and second link color should change as visited.please anyone help me to solve this problem below is my code:

script

 $(document).ready( function() {    
            var st="1";
            var clLiID = 100;
            var fdevLiID = 300;
            var sdevLiID = 400;
            $('.p').click(function(e){
                //alert("123");
                //e.preventDefault();
                var bid=2;
                //var bid="1";
                $.ajax({
                    url:"<?php echo base_url(); ?>/afcks/search",
                    data:{'b_id': bid},
                    type:"POST",
                    cache:false,
                    success:function(data)
                    {
                        //alert(data);
                        var sta="";
                        var obj = $.parseJSON(data);
                        var result = "<ul id='loct' >";
                            $.each(obj, function()
                            {
                                sta=this['branch_id'];
                                //alert(this['course_name']);
                                if(sta==2)
                                {
                                result = result + "<li  item-checked='true' item-expanded='true' class='treeLi'> <a Class='cours' id='alink' temp_id='" + fdevLiID + "' temp_id1='" + sdevLiID + "' cid='"+this['course_id']+"' bid='"+this['branch_id']+"' href='javascript:void(0);'>" + this['course_name'] + "</a></li><div class='" + clLiID + "' id='" +fdevLiID + "'></div><div id='" + sdevLiID + "'></div>";
                                fdevLiID++;
                                sdevLiID++;
                                clLiID++;
                                }
                            });
                            result = result + "</ul>";


                            //alert(result);
                            if(st=="1")
                            {
                            document.getElementById("cour1").innerHTML =result;
                            st="2";
                            }
                            else
                            {
                                document.getElementById("cour1").innerHTML ="";
                                st="1";
                            }

                    }


                });




            });
        });

another script

  <script>
  var st1="1";
            $(document).on('click', '.cours', function() {
                    $('.cours').removeClass("visited");
                    $('.cours').addClass("visited");
    </script>

CSS

 #loct a
 {
color:white;
//line-height:15px;
text-align:right;
font-size: 17.5px;
font-family:Trebuchet MS;
list-style-type: none;
text-decoration:none;
//font-style:italic;
/*a {color:#FF0000;} */
 }
 #loct a:hover
  {
color:#F1C40F ;
transform: scale(1.2);
text-decoration:none;
  }

 #loct a.visited
  {
color:#F1C40F ;
font-size:17.5px;
font-family:Trebuchet MS;
//transform: scale(1);
//background-color:white;
  }

Answer 1

You need to change the small script:

<script>
  var st1="1";
  $(document).on('click', '.cours', function() {
    $('.cours').removeClass("visited");
    $(this).addClass("visited"); /* Use this to address the clicked element */
  })
</script>

how can we write visited function for the dynamically printed anchor tags

1 个答案: