I am trying to hide a certain fieldset with an id of "retail" based on if the URL has 'studio' as a part of it. The URL would read as follows:
/island-careers/studio/accounting/accountant/apply.html
Here is my script I have written up but I can't seem to get it to recognize if 'studio' is in the URL.
<script>
jQuery(document).ready(function(){
var path = window.location.pathname;
console.log(path);
var split = window.location.href.split('/');
console.log(split);
console.log(split[4]);
if (split[4] === 'studio') {
jQuery('#retail').css('display, none');
}
});
</script>
The "console.log(split[4]); was to find the location of 'studio' in the array. There must be something wrong with my IF statement I guess. I also tried this method but it didn't work for me either:
<script>
jQuery(document).ready(function(){
var path = window.location.pathname;
console.log(path);
if (path.indexOf('studio') >= 0) {
jQuery('#retail').css('display, none')
}
});
</script>
Your jQuery line to change the CSS should be:
jQuery('#retail').css('display', 'none');
Related
How can I notify the user when the section identified by the url fragment is not found on a webpage?
Example:
website1 contains:
bring me to the foo section of website2
and website 2 contains:
<div id="foo"> I'm the foo section </div>
So if I click the link and the identifier of the div is not "foo" but "bar" the webpage displays an alert like "foo section not found".
Context: I'm exposing on an html page a JSON response for an API and I want the attributes of the JSON to link to a documentation page. If the section describing that attribute is not found an alert should suggest to update the documentation.
UPDATE: without using javascript frameworks if possible
Thanks
This should do the trick.
On "onLoad" of website2 I check if the url contains a segment and then look for that Id in the document using getElementById(segment) ..
<html>
<body onload="myFunction()">
<h1>Hello World!</h1>
<script>
function myFunction() {
var segment;
if(window.location.hash){
segment = window.location.hash.substring(1);
if( document.getElementById(segment) == null ){
alert("html element with id "+segment+" not found");
}
}
}
</script>
</body>
</html>
Are you using jQuery?
You can't do this with html or css, but you can do it very easily with jQuery, like this:
$('.navigation a').on("click", function(){
//This gets the href and splits it on "#". Grabs the value after "#"
//Make sure to only have 1 # in a link
var idToFind = $(this).attr("href").split("#")[1];
//Check if a div with this ID exists
if($('#'+idToFind).length > 0){
//it has been found, you could turn the scrolling to the section into a neat animation here, if you want
}
else{
//It has not found it. Alert.
alert('"' + idToFind + '" section not found');
}
});
edit
Here's a vanilla js solution:
html:
bring me to the foo section
Javascript:
function checkSection(section){
var idToFind = $(this).getAttribute("href").split("#")[1];
//Get the element
var element = document.getElementById(idToFind);
//check if element exists
if (typeof(element) != 'undefined' && element != null)
{
// exists.
}
else{
//doesn't exist
alert(idToFind + "doesn't exist");
}
}
This code is supposed to show/hide a text based on the page's url, but it's not working:
var pages = window.location.href;
if(pages == "page1.html"){
//display page 1 text
}
else if(pages == "page2.html"){
//display page 2 text
}
http://jsfiddle.net/yp8h2moe/1/
I tested it localy, didn't work, so I tested with jsfiddle, but unfortunately every time you save a jsfiddle, you get a new url.
UPDATE
Here is the updated code, I was able to run it specifying the file extention, but I need it to run with the url only:
<script>
var pages = window.location.href;
if( pages.split('/').pop() === 'http://akecheta.com/free-blogger-templates/' ) {
document.write('<b>Hello World 1</b>');
}
else if( pages.split('/').pop() === 'http://akecheta.com/free-blogger-templates/' ) {
document.write('<b>Hello World 2</b>');
}
</script>
THE SOLUTION
How can I insert HTML text in Javascript the right way?
The value of href is usually an absolute URL so you have to use .indexOf() as follows:
var pages = window.location.href;
if(pages.indexOf("page1.html") > -1){
//display page 1 text
}
else if(pages.indexOf("page2.html") > -1 ){
//display page 2 text
}
Alternatively you could use .split() and .pop(), assuming your urls do not have query strings:
if( pages.split('/').pop() === 'page1.html' ) {
//...
UPDATE
When using absolute URLs or larger parts thereof, you do not need to use .split() and .pop(). Bear in mind that split creates an array whereas pop obtains the last element of that array. You won't be needing this process with absolute URLs.
var pages = window.location.href;
if( pages.indexOf( 'http://akecheta.com/free-blogger-templates/' ) > -1 ) {
document.write('<b>Hello World 1</b>');
}
else if( pages.indexOf( 'http://akecheta.com/free-blogger-templates/xx' ) > -1 ) {
document.write('<b>Hello World 2</b>');
}
It doesn't work because in your jsfiddle var pages is "http://fiddle.jshell.net/_display/ "
try to console.log it and make sure to trim it too if it is needed..
In your case for page1.html etc.. you have to compare it to the full/absolute path
If your URL is http://wwww.example.com/page1.html, then you need the URL path. So, code will look something like below
var pages = location.pathname;
if(pages == "/page1.html"){
//display page 1 text
}
else if(pages == "/page2.html"){
//display page 2 text
}
I want to check window.location, if have "IsReload=True" keyword, I'll remove it. For example: this my window.location:
http://localhost/Demo/User/ManagedUsersTab?isReload=True
I want to remove "?isReload=True" and no reload this page, just remove it. How can I do it. This my snippet:
if (window.location.href.indexOf("?isReload=True") > -1) {
window.location.replace('#Url.Action("ManagedUsersTab", "User")');
}
this snippet reload page
Try
var regex = /(\?|&)isReload=True/;
var location = window.location.href;
if(regex.test(location)){
window.location =location.replace(regex, '$1')
}
Trying to figure out a way to use Javascript to set up a little if-else statement using only part of the url to determine if a link should go one place or another. So far what I got is,
<script type="text/javascript">
if (url.indexOf("example.com/") != -1)
{
Blahblah
} else {
Blahblah
}
</script>
The problem is that the link doesn't even appear so I don't know how wrong or not I am.
Thanks for any help.
Edit: Lets just say for the sake of argument it is a blank html page. As in <html>
<body>
</body>
</html>
Looking for more of a proof of concept then branch out into getting this working on a full scale site.
Edit #2:
Figured it out, even has url detection.
<a id="link">link</a>
<script type="text/javascript">
var link = document.getElementById('link');
var referrerUrl = document.referrer;
if (referrerUrl.indexOf("searchurlfor") != -1)
{
link.href = "place1";
} else {
link.href = "place2";
}
</script>
Try not mixing HTML and JavaScript:
<a id="someLink" target="_blank">Blahblah</a>
<script>
document.getElementById('someLink').href =
(url.indexOf("example.com/") != -1)? 'placeone.htm' : 'placetwo.htm'
</script>
or more verbosely:
<script>
var linkElem = document.getElementById('someLink');
if(url.indexOf("example.com/") != -1) {
linkElem.href = 'placeone.htm';
} else {
linkElem.href = 'placetwo.htm';
}
</script>
Preferably the script should go to a separate file. The way you suggest feels like PHP or JSP but JavaScript does not work this way. In the example above you first render empty link and change the href attribute afterwards.
I think you want:
<script>
if (url.indexOf("example.com/") != -1)
{
document.write('Blahblah');
} else {
document.write('Blahblah');
}
</script>
You need getElementById
HTML:
<a id="link">link</a>
Javascript
<script type="text/javascript">
var link = document.getElementById('link');
if (url.indexOf("example.com/") != -1)
{
link.href="placeone.com";
} else {
link.href="placetwo.com";
}
</script>
You'd have to show us where/when this code is executing in your page. You can't just drop HTML into the middle of a piece of javascript like you were doing.
You can call:
document.write('Blahblah');
to insert HTML into the current place in the document if this is an inline script.
If this code is not executing inline in the document, then you should not use document.write() as that will clear your document and start a new one. Instead, you would use DOM manipulation functions to insert this into the appropriate place in the page or to change the href on an existing link. For example to change the href on an existing link when you have this HTML:
<a id="myLink" href="placeone.com" target="_blank">Blahblah</a>
You would use this javascript that must run after the page has been loaded:
var link = document.getElementById("myLink");
(url.indexOf("example.com/") != -1) {
link.href = "placeone.com";
} else {
link.href = "placetwo.com";
}
How can I get the document url and compare it with an conditional branch?
Pseudo Code:
If document url = "../products.html"
Then do this piece of code();
If you are working with loaded html, you can try
if(window.location.pathname == "products.html"){
//do something here
}
location.pathname returns the file name or path specified by the location.
In addition, You can get the file name by
var p = window.location.pathname.split("/");
var filename = p[p.length-1];