If href contains X, change href

Question

I've got a problem, that seemed trival at the beggining. There are several objects with class 'special' and for each of them there is a need to modify a href accordingly to the parameter. For example, if an url contains '#1' then it should be changed to '#HERE'. See example here: jsfiddle

<a class="o-btn special" href="https://www.example.com/site#1">open</a><br>
<a class="o-btn special" href="https://www.example.com/site#2">open</a><br>
<a class="o-btn special" href="https://www.example.com/site#3">open</a><br>
<a class="o-btn special" href="https://www.example.com/site#4">open</a><br>
<a class="o-btn special" href="https://www.example.com/site#12">open</a><br>

if ( $(".special").attr("href").indexOf('#1')>-1 )
                $(function(){$(".special").attr("href","https://www.example.com/site#HERE?".concat(URI(window.location.href).query()))}
else if ( $(".special").attr("href").indexOf('#2')>-1 )
                $(function(){$(".special").attr("href","https://www.example.com/site#2?".concat(URI(window.location.href).query()))}
else if ( $(".special").attr("href").indexOf('#3')>-1 )
                $(function(){$(".special").attr("href","https://www.example.com/site#3?".concat(URI(window.location.href).query()))}
else if ( $(".special").attr("href").indexOf('#4')>-1 )
                $(function(){$(".special").attr("href","https://www.example.com/site#4?".concat(URI(window.location.href).query()))}
else if ( $(".special").attr("href").indexOf('#5')>-1 )
                $(function(){$(".special").attr("href","https://www.example.com/site#5?".concat(URI(window.location.href).query()))}
else if ( $(".special").attr("href").indexOf('#6')>-1 )
                $(function(){$(".special").attr("href","https://www.example.com/site#6?".concat(URI(window.location.href).query()))}
else $(function()
                $(function(){$(".special").attr("href","https://www.example.com/site?".concat(URI(window.location.href).query()))})

The ifs seem to be working correctly, but I do not know why the part:

$(function(){ 
     $(".special").attr("href", "https://www.example.com/site#3?".concat(URI(window.location.href).query()))
}

is not.

Answer 1

You can organize your script better way:

 $.fn.extend({ fixLink: function () { return this.each(function (i) { var thisLink = $(this); var thisHref = thisLink.attr("href"); var splited = thisHref.split('#'); if (splited.length > 1) { var hash = splited.pop(); switch( hash ) { case '1': thisHref = thisHref.replace('#1', '#HERE'); break; case '12': thisHref = thisHref.replace('#12', '#SOMEWHERE'); break; default: break; }; thisHref += '?url=' + encodeURIComponent(window.location.href); thisLink.attr('href', thisHref); }; }) } }); $('.special').fixLink(); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <a class="o-btn special" href="https://www.example.com/site#1">open</a> <br> <a class="o-btn special" href="https://www.example.com/site#2">open</a> <br> <a class="o-btn special" href="https://www.example.com/site#3">open</a> <br> <a class="o-btn special" href="https://www.example.com/site#4">open</a> <br> <a class="o-btn special" href="https://www.example.com/site#12">open</a> <br> 

Fiddle playground