Reputation: 2375
Is there any option in HTML or JavaScript for when a user clicks on a link, if that link is available then done, if not then goes on another link.
Here is part of my code:
<div id="sidebar-collapse" class="col-sm-3 col-lg-2 sidebar">
<ul>
<li><a href="/returns"><span class="glyphicon glyphicon-log-in"></span> Returns</a></li>
<li class="active"><a href="/pay_reco" target="_blank"><span class="glyphicon glyphicon-log-in"></span> Payment Recouncillation </a></li>
<li ><a href="/pay_get" target="_blank"><span class="glyphicon glyphicon-log-in"></span> Payment Get </a></li>
<li><a href="/import"><span class="glyphicon glyphicon-log-in"></span> Import </a></li>
<li>
<!-- Here I want to add Two link in a href tag if first link does not
available (web page not available) then it go to another link
<!-- <object data="http:/127.0.0.1:9004" type="href" > -->
<a target="_blank" href="http://127.0.0.1:9001">
<span class="glyphicon glyphicon-log-in"></span>
ComPare
</a>
</li>
<li><a target="_blank" href="http://127.0.0.1:9000"><span class="glyphicon glyphicon-log-in"></span> Portal </a></li>
Upvotes: 7
Views: 740
Reputation: 1947
Step 1: Update your HTML code like below.
<a id="selector" href="javascript:void(0)">
<span class="glyphicon glyphicon-log-in"></span>
ComPare
</a>
Step 2: After update your HTML, handle click event with jQuery and send ajax request, if response ok, go link 1, or another case you route to user another url.
$(function(){
$('body').on('click', '#selector', function() {
$.ajax({
type: "GET",
url: "http://127.0.0.1:9001",
complete: function(xhr, textStatus) {
if(xhr.status == 200) window.location = "http://127.0.0.1:9001";
else window.location = "http://127.0.0.1:9004";
}
});
})
})
I created little jQuery plugin for this case on here
With AnotherJS:
HTML:
<a href="http://127.0.0.1:9001" data-another="http://127.0.0.1:9004">Link Text</a>
Javascript:
$(function() {
$('a').another();
})
That's all! :)
Upvotes: 5