I am trying to write this condition in javascript:
if(window.location.pathname != '/our-communities.php' && (window.location.pathname == '/upcoming-communities.php' && window.location.search != '')){
What I am trying to say is if the page is not our-communities.php and if the page is not upcoming-communities.php and window.location.search is not blank then run the code.
So this condition should run on every page except for our-communities.php but can run on upcoming-communities.php only if window.location.search is blank.
if (window.location.pathname != "/our-communities.php" || (window.location.pathname == "/upcoming-communities.php" && window.location.search == "")) {
}
One thing to note, if the page is "/upcoming-communities.php" then the first condition will always be true meaning the second OR statement is irrelevant, if you want to enforce that then extra conditionals are needed.
if ((window.location.pathname != "/our-communities.php" && window.location.pathname != "/upcoming-communities.php") || (window.location.pathname == "/upcoming-communities.php" && window.location.search == "")) {
}
Related
I need to show a specific button only when some fields in another form are filled.
Working on wordpress and woocommerce.
These fields come from a plugin that gives me custom fields for woocommerce.
The button is from another plugin about a configurator, normally that button is accessible as soon as you enter the product page, it let's you customize stuff.
Even though these fileds are required I need to make sure customers fill those first, that's why I thought about hiding the customizer button untill all previous fields are filled.
After so many tries i finally found a solution but unfortunately not so scalable
jQuery(document).ready(function($){
var checkExist = setInterval(function() {
if (
($('.collo input[required]').val() != '') &&
($('.spalle input[required]').val() != '') &&
($('.manica input[required]').val() != '') &&
($('.torace input[required]').val() != '') &&
($('.vita input[required]').val() != '') &&
($('.bacino input[required]').val() != '') &&
($('.braccio input[required]').val() != '') &&
($('.avambraccio input[required]').val() != '') &&
($('.polso input[required]').val() != '') &&
($('.camicia input[required]').val() != '')) {
$(".configure-product").show();
clearInterval(checkExist);
}
else {
$(".configure-product").hide();
}
}, 400);
});
Is it possible to make it more scalable?
Ciao Riccardo,
Are you looking for this ?
jQuery(document).ready(function($){
$(".wapf-wrapper").on("keyup", function() {
var filled = true;
$(".wapf-wrapper").each(function(){
if($(this).val() == '') {
filled = false
}
});
$(".configure-product").toggle(filled);
});
});
check on codepen
I made a simple HTML website using HTML and JavaScript that suggests a song based on the attributes that the user selects. I have everything working, However, for example, in the image below, the second "else-if" statement and the last "else-if" statement end up returning the song title of the second "else-if" statement. In the last statement, it will return the song title that is in the second "else-if" statement. It looks like it is ignoring the band[0].checked part of the condition of the last "else-if" statement. I am unsure why it is just ignoring that part of the condition for the statement? My code for this part is below:
Everything works as it should, except for the last two "else-if" statements because of the issue I stated above.
var genre = document.getElementById("songGenre").value;
var bandList = document.getElementsByName("bandList");
var band = document.getElementsByName("band");
if (genre == "Rock" && bandList[0].checked && band[1].checked && band[2].checked) {
alert("Our song suggestion: Tip the Scales");
}
else if (genre == "Rock" && bandList[0].checked && band[1].checked && band[3].checked) {
alert("Our song suggestion: Savior");
}
else if (genre == "Rock" && bandList[0].checked && band[0].checked && band[2].checked) {
alert("Our song suggestion: Hero of War");
}
else if (genre == "Rock" && bandList[0].checked && band[0].checked && band[3].checked) {
alert("Our song suggestion: Swing Life Away");
}
else if (genre == "Rock" && bandList[0].checked && band[0].checked && band[1].checked && band[2].checked) {
alert("Our song suggestion: Entertainment");
}
else if (genre == "Rock" && bandList[0].checked && band[0].checked && band[1].checked && band[3].checked) {
alert("Our song suggestion: Elective Amnesia");
}
This is happening because when the condition:
(genre == "Rock" && bandList[0].checked && band[0].checked && band[1].checked && band[3].checked)
is true, then
(genre == "Rock" && bandList[0].checked && band[1].checked && band[3].checked)
is also true.
However, since you are using elseif, it will stop at the second condition and not continue checking down the line.
In order to fix this, you need to change the order of you elseif blocks, and put the most specific one in the top, and the more generic one in the bottom. In other words, put the longer complex if's on top, and simple short ones in the bottom.
Once you fix the order from specific --> simple, you will see your application behaving as expected.
I dont want to do the if statement when on pageAge OR ON pageMore. When i go to pageAge it works it doesn't execute the script but when I go to pageMore it does. I'm not sure what operator to use in this situation. When I put pageMore before the || it works on that page but not on the othe one.
if ( top.location.pathname != pageAge || pageMore) {
//if not verified go to connect
$("body").css("display", "none");
if (age === null && top.location.pathname != pageConnect) {
window.location.href = pageConnect;
}
//if to young go to age page while cookie is found (1day)
if (age == toYoung) {
window.location.href = pageAge;
}
//if already verified go to like page.
if (age == legal && top.location.pathname === pageConnect) {
window.location.href = pageLike;
}
}
It should be:
if ( top.location.pathname != pageAge && top.location.pathname != pageMore)
When I use these similar JS code (the 2 immediately below), my output is wrong or doesn't show.
Here is my codes in question:
if (location.href != "website.com/page1" || "website.com/page2")
{
element.style.backgroundColor='none';
}
or with != and !==
if (location.href != "website.com/page1" || location.href != "website.com/page2")
{
element.style.backgroundColor='none';
}
Here is how I'm using it with other code (simplified)
<script>
var element = document.getElementbyId('idElement');
if (location.href != "website.com/page1")
{
element.style.backgroundColor='blue';
}
if (location.href != "website.com/page2")
{
element.style.backgroundColor='green';
}
//HERE'S WHERE I PUT IT
if (location.href != "website.com/page1" || "website.com/page2")
{
element.style.backgroundColor='none';
}
</script>
Either nothing happens or the element doesn't work properly on other pages.
What am I doing wrong?
More Info: I'm making a Tumblr theme and there are pages that will have certain post with different characteristics when viewed on different pages. I have to have this code in the top.
Someone Suggested This: SOLVED
<script>
window.onload = function ()
var element = document.getElementbyId('idElement');
if (location.href != "website.com/page1" && location.href != "website.com/page2")
{
element.style.backgroundColor='none';
}
if (location.href == "website.com/page1")
{
element.style.backgroundColor='blue';
}
if (location.href == "website.com/page2")
{
element.style.backgroundColor='green';
}
</script>
Aside from obvious syntactic error (for example, you left off a closing quotation mark after website.com/page2), there are a few things you might want to do, to narrow this down a bit.
For one thing, you might want to only get the location.href once and store that in a variable. While you're doing that, you could use toLowerCase() on it, so that you know for certain you're comparing apples to apples:
var currLoc = location.href.toLowerCase();
Your logic is also a bit interesting... first you're saying, "If we're not on page1, use blue. If we're not on page2, use green. If we're not on page1 or string is page2, use no color."
So, at the end of it all, no color is showing up because the very last thing you're saying is to clear the color if you're not on page1 or page2? That part is not terribly clear and is probably part of the problem, in addition to the syntax errors. Note that, when evaluating this line:
if (location.href != "website.com/page1" || "website.com/page2)
you're saying "if location.href isn't page1 OR if String("website.com/page2") exists"
If you're testing location.href in both cases, you want:
if (location.href != "website.com/page1" && location.href != "website.com/page2")
as I assume what you mean to say.
So, try changing your script to something like this:
var element = document.getElementbyId('idElement');
var currLoc = location.href.toLowerCase();
// let's save this in a var, too, so you're only changing color once!
var toColor = "none";
if (currLoc != "website.com/page1") {
toColor = 'blue';
}
if (currLoc != "website.com/page2") {
toColor = 'green';
}
//HERE'S WHERE I PUT IT
if (currLoc != "website.com/page1" && currLoc != "website.com/page2") {
toColor = 'none';
}
element.style.backgroundColor = toColor;
You're not closing your if statements properly.
This:
if (location.href != "website.com/page1" || "website.com/page2)
Should look like this:
if (location.href != "website.com/page1" || "website.com/page2")
and this:
if (location.href != "website.com/page1" || location.href != "website.com/page2)
Should look like this:
if (location.href != "website.com/page1" || location.href != "website.com/page2")
If it still doesn't work, I suggest doing this at the top of your function.
alert(location.href);
and seeing what location.href actually equals.
edit
Now instead of this:
(location.href != "website.com/page1" || "website.com/page2")
It needs to look like this:
(location.href != "website.com/page1" || location.href != "website.com/page2")
We're slowly getting there!
I've got this little bit of code on my webpage header to redirect the user to a different page if they are using an iPhone:
<script type="text/javascript">
if ((navigator.userAgent.indexOf('iPhone') != -1) ||
(navigator.userAgent.indexOf('iPod') != -1)) {
document.location = "iPhone.aspx"; }
</script>
Is there an easy way to 'reverse' this code, so anyone landing on the iPhone page from ANY other browser will be redirected back to the home page?
Many thanks.
Simple solution. Replace your existing one with this.
if(!/(iphone|ipod)/i.test(navigator.userAgent)) {
window.location = "Desktop.aspx";
}
Updated since its only for iPhone page.
To reverse? Replace != -1 with == -1
Edit:
Suppose you mean something like this:
if ((navigator.userAgent.indexOf('iPhone') != -1) ||
(navigator.userAgent.indexOf('iPod') != -1)) {
document.location = "iPhone.aspx"; } else {
document.location = "notiPhone.aspx";
}
(navigator.userAgent.indexOf('iPhone') == -1 means there is no such string "iPhone" in the userAgent. So when you change from != to ==, you need to change || to && as well.
if ((navigator.userAgent.indexOf('iPhone') == -1)
&& (navigator.userAgent.indexOf('iPod') == -1)) {
document.location = 'default.aspx';
}