Reputation: 147
I am looking for a code, which I can put inside a standard HTML href link - that, once the link is clicked, will immediately update a portion of the link in real-time.
Something like:
<a href="http://example.com/<?php code(); ?>/">Example</a>
Will at first print:
<a href="http://example.com/page1/">Example</a>
And so after it being clicked once, it'll instantly change to:
<a href="http://example.com/page1-clicked/">Example</a>
Anyone got anything simple up the sleeve for that?
Thanks!
Upvotes: 0
Views: 1874
Reputation: 100
using JQuery's one event handler to change the link only once:
$(function () {
$('a').one(function (event) {
var elem = $(this);
var before = elem.attr('href');
var after = before + '-clicked/';
elem.attr('href', after);
})
});
Upvotes: 0
Reputation: 667
First include JQuery
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" ></script>
Give your link an id
<a id="link" href="http://example.com/page1/">Example</a>
Use the link in your JQuery code
$(document).ready(function() {
$(document).on("click", "#link", function() {
$(this).attr("href", "http://example.com/page1-clicked/");
});
});
edit
I you want to do the same with many links give your link a class
<a class="link" href="http://example.com/page1/">Example</a>
Then change the JQuery code to
$(document).ready(function() {
$(document).on("click", ".link", function() {
$(this).attr("href", "http://example.com/page1-clicked/");
});
});
Upvotes: 3