Why doesn't my if-else statement work? - javascript

Can anyone see why this does not work:
<script>
if (url==showbasket.html||order1.html||order2.html||order3.html||order4.html) {
document.write('<span style="font-family:lucida;font-size:10px;">Hello</span>');
} else {
document.write('<span style="font-family:lucida;font-size:30px;">Hello Hello</span>');
}
</script>
I´m trying to write a script that do this:
IF URL = 1.html or 2.html or 3.html or 4.html THEN
write option1
ELSE
write option2 (for all other URL´s)

if (url == "showbasket.html" || url == "order1.html" || url == "order2.html" || url == "order3.html" || url == "order4.html")
You have to do the check for each url and if it's a string use quotes

I don't think you got your if condition right:
if (url == showbasket.html || url == order1.html || ...

This code is valid, but it will not do what you want
if (url==showbasket.html||order1.html
"url==showbasket.html" checks if "url" is equal to the "html" attribute of object "showbasket". Since showbasket does not exist, your code will throw an exception.
"||order1.html" means the same, check if the "html" attribute of "order1" object is "true"
Like others have said, what you want to do is :
if ( url == "showbasket.html" || url == "order1.html"

Related

My if/else is not working like it should [duplicate]

This question already has answers here:
JavaScript if "x = (a || b || c)" statement not working
(2 answers)
Closed 7 years ago.
My if else is not working like it should. I have 1 if 1 else if and 1 else. When the function runs it executes the if even if the condition is "false".
Here is the JavaScript:
function onSearch(){
var site;
document.getElementById('bar').value = site;
//These are not the actuall links since it's not the actuall code.
if (site === "Google" || "google"){
location.href = "http://www.google.com";
}
else if (site === "Youtube" || "youtube"){
location.href = "http://www.youtube.com";
}
else{
document.getElementById("SearchFail01").innerHTML =
"The country " + site + " does not exist";
}
<!-- Here is the HTML -->
<input type='search' id='bar' list='countries' placeholder='Search..'>
<p id="SearchFail01"></p>
In Javascript, a string in a conditional statement is considered True. The "||" operator won't work the way you're trying to make it work so you'll have to spell it out.
if (site === "Google" || site === "google"){
location.href = "http://www.google.com";
}
else if (site === "Youtube" || site === "youtube"){
location.href = "http://www.youtube.com";
}
else{
document.getElementById("SearchFail01").innerHTML =
"The country " + site + " does not exist";
}
edit:
I also noticed this line:
document.getElementById('bar').value = site;
should probably be flipped if you want to assign bar's value to site
site = document.getElementById('bar').value;
The double pipe doesn't work like you expect. This is how it is supposed to be used.
var foo = someVar || "foo"; not to be used inside an if like that
In your case you could simply lowercase the site and use a single ===
if (site.toLowerCase() === "google") {
location.href = "http://www.google.com";
}
You might also want to consider using a switch.
switch (site) {
case "Google":
case "google":
location.href = "http://www.google.com";
break;
case "Youtube":
case "youtube":
location.href = "http://www.youtube.com";
break;
default:
document.getElementById("SearchFail01").innerHTML = "The country " + site + " does not exist";
break;
}
I believe you have a logic problem if your if and your endif conditions.
When you have 2 or more conditions in JavaScript, separated with the OR (||), or AND (&&) operators you need to make the comparisons in each condition.
Instead of:
if (site === "Google" || "google"){
you have to write:
if (site === "Google" || site === "google"){
And instead of:
else if (site === "Youtube" || "youtube"){
you have to write:
else if (site === "Youtube" || site === "youtube"){
Hope this is helpful!
Cheers mate!

CodeMirror and Brackets, Custom Mode with CSS Quick Edit

I'm making a Adobe Brackets Extension to add support for Laravel Blade syntax highlight.
Blade is a template system that runs on top of HTML (more specifically a .php file), without my extension active I can do CTRL+E Quick Edit on a css rule name to quickly find that rule on the stlye.css file.
But when I activate the extension, the CTRL+E is not working anymore, but the HTML syntax is working perfectly.
I'm using overlay mode over text/html.
Here is the main.js extension code:
define(function (require, exports, module) {
'use strict';
var LanguageManager = brackets.getModule("language/LanguageManager");
CodeMirror.defineMode("laravelblade", function (config, parserConfig) {
var mustacheOverlay = {
token: function (stream, state) {
var ch;
//Highlight Comments {{-- --}}
if (stream.match("{{--")) {
while ((ch = stream.next()) != null)
if (ch == "}" && stream.next() == "}") break;
stream.eat("}");
return "comment";
}
//--
//Highlight {{ $var }})
if (stream.match("{{")) {
while ((ch = stream.next()) != null)
if (ch == "}" && stream.next() == "}") break;
stream.eat("}");
return "def";
}
//Highlight {% $var %} (Laravel 5)
else if (stream.match('{%')) {
while ((ch = stream.next()) != null)
if (ch == "%" && stream.next() == "}") break;
stream.eat("}");
return "def";
}
//Highlight {% $var %} (Laravel 5)
else if (stream.match('{%')) {
while ((ch = stream.next()) != null)
if (ch == "%" && stream.next() == "}") break;
stream.eat("}");
return "def";
}
//Return Null if no condition was met.
else if (stream.next() != null) {
return null;
}
}
};
return CodeMirror.overlayMode(CodeMirror.getMode(config, parserConfig.backdrop || "php"), mustacheOverlay);
});
LanguageManager.defineLanguage("laravelblade", {
"name": "Laravel Blade",
"mode": "laravelblade",
"fileExtensions": ["blade.php"],
"blockComment": ["{{--", "--}}"]
});
});
The real question is:
How can I add support for Quick Edit on my custom mode and *blade.php files?
I think the problem is this part of your code:
else if (stream.next() != null) {
return null;
}
Looking at CodeMirror's overlay mode demo, it does something slightly different:
while (stream.next() != null && !stream.match("{{", false)) {}
return null;
Your code is returning null once for each ignored character, while the demo is only returning null once per contiguous chunk of ignored characters.
Returning separately for every character seems to make CodeMirror break up all of its normal tokens into separate one-char tokens, which the Brackets Quick Edit code can't recognize -- e.g. if your cursor is here - cl|ass - CodeMirror says it's in an attribute token where the name is just "l", while the Brackets code is looking attributes named "class".

jQuery issue in IE

Hello I'm using this function as an address book module, for selecting any employee from the sidebar it display all the content of the employee. It works fine in Chrome but not in IE. I'm not able to run the src variables declared in this function in IE. Please suggest me some other ways to declare these type of variables so that these will be compatible to all browsers.
function singleSelect(id)
{
if(flag){
unCheckAll();
userIds="";
//userIds= document.forms['frmSidebarSearch'].elements['userIds'].value + id +",";
var src = ($("#"+id).attr("src") === "<#core.basePath/>images/chk-box-img.gif")
? "<#core.basePath/>images/chk-box-img-tick.gif"
: "<#core.basePath/>images/chk-box-img.gif";
$("#"+id).attr("src",src);
var src2 = ($("#anchor"+id).attr("class") === "")
? "selected"
: "";
$("#anchor"+id).removeClass().addClass(src2);
var elementss = document.getElementById("all").getElementsByTagName('img');
for(i=0;i<elementss.length;i++) {
if($("#"+elementss[i].id).attr("src") === "<#core.basePath/>images/chk-box-img-tick.gif"){
userIds= userIds +"," +elementss[i].id;
}
}
unHilightAll();
highLightIndex(id);
document.forms['frmSidebarSearch'].elements['userIds'].value=userIds;
$('#frmSidebarSearch').ajaxSubmit({target:'#content',url:'<#core.basePath/>sp/manager/manageraddressbook/manager/'+id});
}
flag = true;
}
Have you tried it with double equals (I think triple equals sign is only in languages like php).
(condition == condition) ? true : false;

What does the question mark mean in this function?

Here's the documentation for this plugin (There's only two functions.)
http://tkyk.github.com/jquery-history-plugin/#documentation
$(document).ready(function() {
function load(num) {
$('#content').load(num +".html");
}
$.history.init(function(url) {
load(url == "" ? "1" : url);
});
$('#ajax-links a').live('click', function(e) {
var url = $(this).attr('href');
url = url.replace(/^.*#/, '');
$.history.load(url);
return false;
});
});
Here's the html:
<body>
<h1>jQuery History Plugin Ajax Sample</h1>
<div id="ajax-links">
<ul>
<li>load 1.html</li>
<li>load 2.html</li>
<li>load 3.html</li>
</ul>
<div id="content"></div>
<hr />
</div>
<p>[All samples] [Project home]</p>
</body>
load(url == "" ? "1" : url);
The question mark here is a a ternary if operation, Simply put, it is a short, inline if statement.
Expanded out, the statement would look something like this:
if (url == "")
load("1");
else
load(url);
If the statement before the question mark evaluates to true, then the left-hand side of the colon is used, otherwise (if it is false) the right-hand side is used. You can also nest this, though it isn't always a good idea (for readability).
Its shorthand for:
If (url == ""){
load("1");
}
else {
load(url);
}
Ie. If url equals "" then return "1", otherwise, return url
In your example, if the url equals "" then, 1.html will be loaded, otherwise, url + ".html" will be loaded
It is a ternary operation.

If Statement not working with And (&&) Operator

I'm having a hard time writing up what seems should be a simple if statement! I need it to say if mod does not equal a, b, or c - then do this. Here is what I was trying but have been unsuccessful:
var mod = CURRENT_MODULE_ID;
if (mod != "5827289" && mod != "5195103" && mod != "5181422") {
doSomething();
}
When I type this into my editor it says there is an error, specifically that "The entity name must immediately follow the '&' in the entity reference."
.. and is not working when I go to test.
Any help is appreciated!!
UPDATE:
The url: esber.squarespace.com
The full script:
<script type="text/javascript" src="/storage/scripts/sessvars.js"></script>
<script type="text/javascript">
<![CDATA[
onload=function(){
sessvars.browserConfirmation?'none':'';
sessvars.ageConfirmation?'none':'';
};
var mod = Squarespace.Constants.CURRENT_MODULE_ID;
if (mod != "5827289" && mod != "5195103" && mod != "5181422") {
if(sessvars.ageConfirmation != "yes"){
window.location = "/verify/";
};
};
]]>
</script>
I want every page in the site to automatically redirect on page load to the verify page, unless it is the verify page (/verify), the "You are not verified" page (/not-verified), or the login page (/login) -- unless the user already verified by setting the sessvars, then they can continue on to the homepage.
To test this I go to esber.squarespace.com and click on one the menu items at the right (this menu would eventually be hidden when I'm done with the page) -- when i try to go to another page without veriying my age first i should be redirected back to the /verify page but that isnt happening.
If i revise the script to:
<script type="text/javascript" src="/storage/scripts/sessvars.js"></script>
<script type="text/javascript">
onload=function(){
sessvars.browserConfirmation?'none':'';
sessvars.ageConfirmation?'none':'';
};
var mod = Squarespace.Constants.CURRENT_MODULE_ID;
if (mod != "5827289") {
if(sessvars.ageConfirmation != "yes"){
window.location = "/verify/";
};
};
</script>
then it works fine(?)
Try this:
// <![CDATA[
onload=function(){
sessvars.browserConfirmation?'none':'';
sessvars.ageConfirmation?'none':'';
};
var mod = Squarespace.Constants.CURRENT_MODULE_ID;
if (mod != "5827289" && mod != "5195103" && mod != "5181422") {
if(sessvars.ageConfirmation != "yes"){
window.location = "/verify/";
};
};
// ]]>
If this doesn't work, just leave the code there for a bit, so that we can debug it directly on your website
Wrap your script in a CDATA section.
<script type="text/javascript">
<![CDATA[
// script here
]]>
</script>
I tried the EXACT same code as yours and it works fine:
function doSomething() {alert("doing");}
var CURRENT_MODULE_ID = 5195103000;
var mod = CURRENT_MODULE_ID;
if (mod != "5827289" && mod != "5195103" && mod != "5181422") {
doSomething();
}
It did 'doSomething'. When value is changed to 5195103, nothing happens which is correct
The editor aside, what's the script error when you run it and what's the browser you used? I suspect it could be an error elsewhere or perhaps related to CURRENT_MODULE_ID ?
Are you embedding this javascript in an xml document?
It sounds like the xml document is not well formed, perhaps because the & should be escaped as &
The javascript by itself looks fine too me
Try:
var mod = CURRENT_MODULE_ID;
if (mod != "5827289" && mod != "5195103" && mod != "5181422") {
doSomething();
}
You'll find out that way whether the javasciprt needs to be escaped
Edit in response to comment:
Try the following:
<script type="text/javascript">
<![CDATA[
var mod = CURRENT_MODULE_ID;
if (mod != "5827289" && mod != "5195103" && mod != "5181422") {
doSomething();
}
]]>
</script>
It sounds like your editor just thinks you're working with an XML document. Have you tried actually running this in a browser? If so, does the browser also give an error?
Are you trying to compare the ID as a string or value? Did you try it without quotes?
var mod = CURRENT_MODULE_ID;
if (mod != 5827289 && mod != 5195103 && mod != 5181422) {
doSomething();
}
or another method would be to use match
var mod = CURRENT_MODULE_ID;
if (!mod.match("5827289|5195103|5181422")) {
doSomething();
}
I got this error within a script section in an XSL file.
Entity '&' not defined
I adapted the above answer within my script and it worked.
Note the CDATA section in the code segment below
<script>
var Quantity860=<xsl:value-of select="$QuantityOrdered_860" />;
var Quantity850=<xsl:value-of select="$QuantityOrdered_850" />;
var QuantityToReceive860=<xsl:value-of select="$QuantityLeftToReceive_860" />;
if(parseFloat(Quantity860.textContent) !== parseFloat(Quantity850.textContent) <![CDATA[ && ]]> parseFloat(QuantityToReceive860.textContent) !== parseFloat(Quantity850.textContent))
{
Quantity860.style.color="#FF6347";
Quantity850.style.color="#FF6347";
QuantityToReceive860.style.color="#FF6347";
}
</script>
just use != in comparison instead of == then && will work
if(val != "" && val != "") {
console.log("filled");
}else
{console.log("empty"); }

Categories