Add language suffix to url if it doesn't exist already (javascript)

Question

I have a multi language site and people come in via links WITH a url suffix (/lang/en for instance) or WITHOUT a suffix (just the page url).

Now I want to create the language switch function with a link (with a class to trigger the javascript).

My link class will be "english" for instance and in the JS I first need to check if there isn't a language suffix to the url already before I append it.

Here's what I have right now (from another thread):

<a class="english" href="">English</a>
<script>

$('.datalink').attr('href', function() {
return this.href + '/lang/en';

});

</script>

This adds the suffix but Without checking if it already exists, how do I check if it is already there and not append it? or change it to another language (/lang/nl)?

UPDATE

Actually my class is not on the href but on the <li> around it, it looks like:

<li class="english"><a title="English">English</a></li>

so now I have

$('.english >a').attr('href', function() { 
  var suffix = this.href.match(/lang\/en\/?$/i) ? "" : "/lang/en"; 
  return this.href + suffix; 
}); 

NOTE Wat I want to achieve is two links on each page of my website that will consist of the basic page url with a

lang/en 

or

lang/nl

suffix to them. When clicked those links will load the same page but with the language suffix in the url, my language plugin will pick that up an present the language.

Answer 1

Somehow the none of the above javascript worked for me, I don't know what I was doing wrong but finayl I decided to resort to php cause I understand that much better. I use this on a wordpress site and I came up with the following code (in theme functions.php) that worked for me:

// add languages to menu
add_filter('wp_nav_menu_items','add_langs', 10, 2);

function add_langs($items, $args) 
{

    if( $args->theme_location == 'primary-menu')

$current_url = ( is_ssl() ? 'https://' : 'http://' ) . $_SERVER['HTTP_HOST'] .     $_SERVER['REQUEST_URI'];
$href = str_replace(array('/lang/en','/lang/nl'),'',$current_url);

    $english = '<li class="english"><a href="'.$href.'/lang/en">EN</a></li>';
    $nederlands = '<li class="nederlands"><a href="'.$href.'/lang/nl">NL</a></li>';
    return $items . $english . $nederlands ;

}

This finds my menu called "primary-menu" and adds two items to this menu consisting of $english and $nederlands links.

I had to get the page url with $_server['HTTP_HOST'] instead of get_permalink() cause that one returned a random url somehow. the first one always works and with the str_replace I replace the language additions first if they exist (str_replace doesn't need an if statement, it always checks if it exists before replacing)

Hope this helps someone else out, still wondering why the javascript didn't work for me!

Answer 2

You can use a regular expression to check if the URL contains the suffix:

if (this.href.match(/lang\/en\/?$/i)) {
    /* CONTAINS THE SUFFIX */
} else {
    /* DOESN'T CONTAIN IT */
}

The way that I'd probably do it is as follows:

$('.datalink').attr('href', function() {
    // suffix is blank if the URL already contains the language portion
    var suffix = this.href.match(/lang\/en\/?$/i) ? "" : "/lang/en";
    return this.href + suffix;
});

Answer 3

if it is a suffix that always starts with /lang, try this

Live Demo

$('.english a').each(function() {
    $(this).attr('href', this.href.split("/lang")[0] + '/lang/en');
});

or if you want to keep one if there

$('.english a').each(function() {
  var href = this.href;
  var pos = href.indexOf("/lang/");
  if (pos == -1) $(this).attr('href', href.substring(0,pos)+'/lang/en');
});