Change HREF of a link if the url does not meet some requirements

Asked

Viewed 248 times

3

I have a question. I need to force page 1 value from a page to a specific URL. I couldn’t figure out how to fix the code of the plugin I’m using, so I decided to do a "gambiarra" so I could put the system into production. I would like, via JQUERY, to change the HREF attribute of a certain "A" tag, if its class is "page smaller" and if the url defined does not have the "page" string. But I’m getting it on JS. I tried it this way:

    $(function(){
                if(!$('a[href*="page"]') && $('a').hasclass('page smaller')){    
    $("a").attr("href", "http://10.31.0.137/wordpress/index.php/ajax-fonte/page/0")
                }
});

In short, I need to force the link that points to http://10.31. 0.137/wordpress/index.php/ajax-source/ , point to http://10.31. 0.137/wordpress/index.php/ajax-source/page/0

Here is the pagination code to illustrate

<div class="wp-pagenavi">
<span class="pages">Página 3 de 44</span>
<a class="previouspostslink" rel="prev" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/2/">«</a>
<a class="page smaller" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/">1</a>
<a class="page smaller" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/2/">2</a>
<span class="current">3</span>
<a class="page larger" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/4/">4</a>
<a class="page larger" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/5/">5</a>
<span class="extend">...</span>
<a class="larger page" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/10/">10</a>
<a class="larger page" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/20/">20</a><a class="larger page" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/30/">30</a>
<span class="extend">...</span>
<a class="nextpostslink" rel="next" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/4/">»</a>
</div>

1 answer

3


You can take the element with .page.smaller:not([href*=page]).

This will bring all the elements that have the classes page and smaller where the href attribute does not contain the sequence "page":

$(function(){

  $('.page.smaller:not([href*=page])')
     .attr('href', 'http://10.31.0.137/wordpress/index.php/ajax-fonte/page/0');

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="wp-pagenavi">
  <!-- ... -->
  <a class="page smaller" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/">1</a>
  <a class="page smaller" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/2/">2</a>
  <!-- ... -->
</div>

Like suggestion alternative, since it is only wanting to concatenate the page/0 in href already defined in the element, instead of pasting the absolute URL you can do so:

$(function(){

  $('.page.smaller:not([href*=page])')
     .attr('href', function(i, href){
        return href + 'page/0';
     });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="wp-pagenavi">
  <!-- ... -->
  <a class="page smaller" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/">1</a>
  <a class="page smaller" href="http://10.31.0.137/wordpress/index.php/ajax-fonte/page/2/">2</a>
  <!-- ... -->
</div>

  • 1

    Thank you very much it worked correctly.

  • @Leibovich I edited my answer and includes an alternative that may be better.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.