Ways to alter the color of a link after clicking it?

Question

Ways to alter the color of a link after clicking it?

Is there a way to change the link color when clicking on it? I have tried multiple approaches with no success. The links on this page are ajax-based and the request action is ongoing.

        <div class="topheading-right">
        <span>
            <?php echo $this->Manager->link('Archived Events', array('a'));?>
        </span>
        <?php echo $this->Manager->link('View All', array(''));?>
    </div>
</div>

<div id='events-event_list' class='dashboard-<?php echo __l($product_name);?>s'>
    <?php echo $this->requestAction(array('controller'=>'events', 'action'=>'view_event_list', $is_archive), array('return'));?>
</div>

Any suggestions on how to achieve this? Appreciate the help in advance.

javascript jquery css cakephp cakephp-2.0

Answer 1

Answer №1

When dealing with an AJAX link, the :visited pseudoselector cannot be utilized.

For this scenario, consider using:

 $('a').on('click',function(){this.style.css.color='red'})

or a similar approach

Answer 2

When dealing with an AJAX link, the :visited pseudoselector cannot be utilized.

For this scenario, consider using:

 $('a').on('click',function(){this.style.css.color='red'})

or a similar approach

Answer 3

Answer №2

Experiment

$('.clickable-links').on('click',function(event){
   event.preventDefault();
   var Element = $(this);
   Element.css('color','blue');
   var link = Element.attr('href');
   //make ajax request using link
});

Answer 4

Experiment

$('.clickable-links').on('click',function(event){
   event.preventDefault();
   var Element = $(this);
   Element.css('color','blue');
   var link = Element.attr('href');
   //make ajax request using link
});

Answer 5

Answer №3

This is an example of how it can be done:

 $('button').on('click',function(){
     $(this).addClass('active');
 });

Answer 6

This is an example of how it can be done:

 $('button').on('click',function(){
     $(this).addClass('active');
 });

Answer 7

Answer №4

When using modern browsers (including IE10), simply setting the a:active pseudo-class will result in the desired outcome without the need for JavaScript:

a:active{ color: red; }

Additional attributes can also be assigned as needed.

Answer 8

When using modern browsers (including IE10), simply setting the a:active pseudo-class will result in the desired outcome without the need for JavaScript:

a:active{ color: red; }

Additional attributes can also be assigned as needed.

Ways to alter the color of a link after clicking it?

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Improving React code by using conditional statements such as IF and Else

Pressing the Add button will create a brand new Textarea

Utilizing JQuery for showcasing a success message in ASP.NET WebForms

What makes the creation of Javascript objects so flexible and dynamic?

Implement jQuery pagination with AJAX in PHP

Is pl/pgsql block code supported by postgres-nodejs?

Creating a fetcher that seamlessly functions on both the server and client within Nextjs 13 - the ultimate guide!

What is the best way to validate if fields are blank before sending a message using the button?

Customizing text appearance with innerHTML in JavaScript: A guide to styling

Text within cells is not wrapping onto a new line in an HTML table

"Exploring the world of remote_form_tag in Rails with jrails

Missing Cookie in request using NodeJS and NextJS

Retrieve the component information from the JavaScript function located outside of the main code

Guiding users who have disabled JavaScript through redirection

One way to eliminate a prefix from a downloaded file path is by trimming the URL. For example, if you have a URL like "http://localhost

Updating React component when a property in an array of objects changes by utilizing the useEffect() hook

Utilize async/await to send images using node mailer

Issues with iterating over JSON objects are causing errors

Why isn't the card positioned in the center of the screen?

Executing Ajax requests with callbacks in JavaScript/jQuery