I want make text link to change language
English: http://example.com/
Japan: http://jp.example.com/
When visitor on a page A (English)
example: http://example.com/A
I want make a text link, when visitor click , visitor go to Japan language with link like:
http://jp.example.com/A
I really thank for your help
call following method as onclick="switchLanguage()"
function switchLanguage() {
var url = window.location.href;
if (url.indexOf('jp.example.com') != -1)
window.location.href = url.replace('jp.example.com', 'example.com');
else
window.location.href = url.replace('example.com', 'jp.example.com');
}
Let's assume that your links will be inside
<div id="language-container">
</div>
In this case, let's ensure that we have a function like
function getLanguageLinks() {
let languages = {
"jp": "Japanese",
"": "English",
"ge": "German",
"hu": "Hungarian"
};
var links = [];
for (var key in languages) {
links.push('<p>${languages[key]}</p>');
}
document.getElementById("language-container") = links.join("");
}
and you are calling it in your body tag:
<body onload="getLanguageLinks()">
<!-- Some HTML -->
</body>
Related
So basically I'm a beginner in JavaScript and HTML and trying to play with functions call on JS that will edit my HTML file.
Now, I'm trying to redirect users to different pages based on their type.
I want to use "onload" function in order to determine the user type and edit the link according to the result.
HTML:
<body onload="what_user()">
<div id="result">zone</div>
</body>
JS file:
function what_user() {
var d = document.getElementById("result");
var user = ""; // get the user type
if (user == "") d.outerHTML = "" + "";
else d.outerHTML = "" + "";
}
I have some problems understanding how to call a function from HTML and use it on JS as well as return values.
Thanks in advance!!!
Don't play with elements as string. Create an element and put it where you want.
function what_user() {
var d = document.getElementById("result");
let a = document.createElement('a')
a.text = 'zone'
var user = ""; // get the user type
if (user == "") a.href = 'admin_index.html'
else {
a.href = 'admin_user.html'
}
d.parentNode.removeChild(d);
document.body.appendChild(a)
}
<body onload="what_user()">
<div id="result">zone</div>
</body>
I have a textarea in which I am getting user's input data. But I need to know if there is any URL in textarea and convert it to anchor tag. For example:
Textarea Data:
Hi I'm Abdul. My Website is https://website.com
After Anchor Tag:
Hi I'm Abdul. My Website is https://website.com
Currently my code is:
var status = $('#status').val();
var urlCheck = new RegExp("([a-zA-Z0-9]+://)?([a-zA-Z0-9_]+:[a-zA-Z0-9_]+#)?([a-zA-Z0-9.-]+\\.[A-Za-z]{2,4})(:[0-9]+)?(/.*)?");
if(urlCheck.test(status)) {
alert("url inside");
console.log(urlCheck.exec(status)[0]);
}
This is my current code but I don't know how to replace url with anchor tag in that string.
I am not sure if i understand you correctly, but do you want to have it changed live or after the form was sent? If the latter, i would try something like this:
var urlCheck = new RegExp("([a-zA-Z0-9]+://)?([a-zA-Z0-9_]+:[a-zA-Z0-9_]+#)?([a-zA-Z0-9.-]+\\.[A-Za-z]{2,4})(:[0-9]+)?(/.*)?");
if(urlCheck.test(status)) {
alert("url inside");
console.log(urlCheck.exec(status)[0]);
// Here my possible solution (not tried out)
$('#status').val('<a href="http://'+urlCheck.exec(status)[0]+"' target='_blank'>the link</a>");
}
But this would also mean that you could/must check with a RegEX if the user entered http or not.
var status = $('#status').text();
var urlCheck = new RegExp("([a-zA-Z0-9]+://)?([a-zA-Z0-9_]+:[a-zA-Z0-9_]+#)?([a-zA-Z0-9.-]+\\.[A-Za-z]{2,4})(:[0-9]+)?(/.*)?");
if(urlCheck.test(status)) {
alert("It has an URL!");
console.log(urlCheck.exec(status)[0]);
}
document.getElementById("status").innerHTML = status.replace(urlCheck.exec(status)[0],"<a href='"+urlCheck.exec(status)[0]+"'>"+urlCheck.exec(status)[0]+"</a>");
<div id="status">Hi I'm Abdul. My Website is https://website.com</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
We can use the html.replace() to replace the url inside the tags we wanted.
You have to use the JS replace() function.
I set the following example with an input textarea and an output textarea for let you see the difference.
function addUrl() {
var status = $('#status').val();
var urlCheck = /(([a-zA-Z0-9]+:\/\/)?([a-zA-Z0-9_]+:[a-zA-Z0-9_]+#)?([a-zA-Z0-9.-]+\.[A-Za-z]{2,4})(:[0-9]+)?(\/.*)?)/;
$('#output').val(status.replace(urlCheck, '$1'));
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="status">Input</label>
<textarea id="status" onChange="addUrl()"></textarea>
<br/>
<label for="output">Output</label>
<textarea id="output"></textarea>
use linkifyHtml or linkifyString : Linkify String Interface. Use linkify-string to replace links in plain-text strings with anchor tags.
Part of my code:
<p id="demo">{$value.file_name}</p>
<script type="text/javascript">
var str = document.getElementById("demo").innerHTML;
var res = str.replace("/var/www/html/biology/demo", "");
document.getElementById('para').innerHTML = res;
</script>
<a href="#para" id='para'>Download</a>
This part of the url will already be present: "a.b.c.d.edu/bio/cluster/"
$value.file_name contains "/var/www/html/biology/demo/files/mpijobs/107/mothership/data/job107_0_0_output.tif"
After the script, "para" contains the edited path which is "/files/mpijobs/107/mothership/data/job107_0_0_output.tif" (the removal of "/var/www/html/biology/demo")
The code:
Download
provides a clickable link to "a.b.c.d.edu/bio/cluster//var/www/html/biology/demo/files/mpijobs/107/mothership/data/job107_0_0_output.tif"
and what I want to do is replace "{$value.file_name}" inside the brackets with "para" (and what it represents) so that the download link is linked to
"a.b.c.d.edu/bio/cluster//files/mpijobs/107/mothership/data/job107_0_0_output.tif"
Sorry, I misunderstood.
If the a href attribute is set like so:
Download
You can use in the javascript:
str.setAttribute("href", res);
EDIT:
Ok I got it. Sorry about this strenuous exercise. Here's what you should write:
<p id="demo">{$value.file_name}</p>
<a href="#para" id='para'>Download</a>
<script type="text/javascript">
var str = document.getElementById("demo").innerHTML;
var res = str.replace("/var/www/html/biology/demo", "");
para = document.getElementById('para');
para.href = res;
</script>
I want to redirect my users to different languages/subfolders based on their IP address. To do this I use the JavaScript GeoIP API from MaxMind.
The problem: The english speaking people should stay at mydomain.com and not go to mydomain.com/en/. But when I redirect to mydomain.com the GeoIP script runs again which creates an infinite loop.
Here is my code (in index.html for mydomain.com):
<script language="JavaScript" src="http://j.maxmind.com/app/geoip.js"></script>
<script language="JavaScript">
var country = geoip_country_code();
if(country == "FR")
{
window.location = "http://mydomain.com/fr/"
}
else
{
window.location = "http://mydomain.com/";
}
</script>
In other posts I read about setting a cookie, but I wasn't able to do it in a way that solves the problem (and it would still create a loop when the user doesn't accept cookies, on mobile for example).
Another solution could be to redirect to mydomain.com/en/ and delete the /en/ folder in the URL via htaccess, but I wasn't able to get this done either.
An example of how I want it to work would be waze.com (it seems like they have the english version in the /en/ folder, but delete it from the URL).
So if anybody is able to help, I would be very grateful. Thanks a lot!
EDIT: I solved the problem myself. It's very simple: Just use the root directory for the english page and change function to "else {null;}" :-)
Your problem is not with geoip but with your code.
Try this:
var country = geoip_country_code();
var currentLocation = String(window.location);
//if geoip is equal FR and window.location is different "http://mydomain.com/fr/"
if(country === "FR" && currentLocation.indexOf("http://mydomain.com/fr/")!==0)
{
window.location = "http://mydomain.com/fr/"
}
//if geoip is different FR and window.location is equal "http://mydomain.com/fr/"
else if(currentLocation.indexOf("http://mydomain.com/fr/")===0)
{
window.location = "http://mydomain.com/";
}
To detect using multiple languages simply edit the following variables:
var defaultsLang are the languages that are supported by the main root (site.com/)
var languages languages supported by sub-pages (site.com/fr/, site.com/es/, etc.)
See code (not tested):
(function(){
var defaultsLang = ["en-us","en"];
var languages = {
"fr": true, //enable french pages
"pt": false, //tmp disable portuguese pages
"es": true //enable spanish pages
};
var country = geoip_country_code().toLowerCase(),
currentLocation = String(window.location),
detectCurrent = function(){
var a = currentLocation.replace(/^(http|https)[:]\/\//, "");
var b = a.split("\/");
b = b[1].toLowerCase();
a = null;
return b.length<5 && (/^[a-z\-]+$/).test(b) ? b : false;
};
var currentLang = detectCurrent();
defaultsLang = "|"+defaultsLang.join("|")+"|";
if(currentLang!==country && typeof languages[country] !=="undefined" && languages[country]!==false){
window.location = "http://mydomain.com/" + country + "/";
} else if(
defaultsLang.indexOf("|" + currentLang + "|")===-1 && //current page is not the same as default languague(s)
defaultsLang.indexOf("|" + country + "|")!==-1 && //geoip is in the list of default language(s)
currentLang!==false
){
window.location = "http://mydomain.com/";
}
})();
I manage a website for an organization that has separate chapter sites. There is a membership signup form that is on the main website that each chapter links to. On the form there is a dropdown box that allows a person to choose the chapter they want to join. What I would like to do is have each chapter website use a specific link to the form that will preselect their chapter from the dropdown box.
After searching the web, I found that I will probably need to use a Javascript function to utilize a Query String. With all my searching, I still can't figure out the exact code to use. The page is a basic HTML page...no php and it is hosted on a linux server.
Any help would be greatly appreciated.
If you format your url like this:
www.myorg.com?chapter=1
You could add this script to your html head:
function getparam(name) {
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regexS = "[\\?&]" + name + "=([^&#]*)";
var regex = new RegExp(regexS);
var results = regex.exec(window.location.href);
if (results == null)
return "";
else
return results[1];
}
function loadform()
{
var list = document.getElementById("mychapterdropdown");
var chapter = getparam("chapter");
if (chapter>=0 && chapter < list.options.length)
{
list.selectedIndex = chapter;
}
}
The in your html body tag:
<body onload="loadform();" >
Could probably add more validation checks but that's the general idea.
It sounds like what you are looking for are GET or POST requests. For instance, if your user selects "Chapter A" from your form and hits select, you can allow redirects from another site (for instance http://www.yoursite.com/form.html?chapter=A) to allow Chapter A to be preselected. In Javascript this is done by
var chapter="";
var queryString = location.search.substring(1);
if ( queryString.length > 0 ) {
var getdata = queryString.split("&");
var keyvalues;
for(var i=0; i < getdata.length; i++){
keyvalues = getdata.split("=");
}
} else {
chapter = "Not Found";
}
document.getElementById( "ChapterID").value = keyvalues['chapter'];
This is untested, so don't hold me to it :).
maybe something using parse_url
$params = parse_url()
$query = $params['query'];
$query_pairs = explode('&',$query);
$key_val = array();
foreach($query_pairs as $key => $val){
$key_val[$key] = $val;
}
http://www.php.net/manual/en/function.parse-url.php
You would probably have to use an dynamic ajax content. Use the following javascript to read the querystring, then load the html file in that div using this javascript.