I tend to write my javascript as big blocks of code without many variable or functions but have decided to clean up my act! Below is an attempt at writing a cleaner version of a script that hides certain form elements depending on the value of a drop down box.
The script worked perfectly before I tried to tidy it up but now I cannot see where the problem is? Could anyone advise me of any problems with my syntax here. Apologies for the very specific post.
Thanks,
Rich
function hideTitle(hide){
if(hide = "true"){
document.admin.title.style.display="none";
document.getElementById("titleText").style.display="none";
};
else if(hide = "false"){
document.admin.title.style.display="inline";
document.getElementById("titleText").style.display="inline";
};
};
function hideSocMedLinks(hide){
if(hide = "true"){
document.admin.facebookLink.style.display="none";
document.admin.twitterLink.style.display="none";
document.getElementById("fbtext").style.display="none";
document.getElementById("twittext").style.display="none";
};
else if(hide = "false"){
document.admin.facebookLink.style.display="block";
document.admin.twitterLink.style.display="block";
document.getElementById("fbtext").style.display="inline";
document.getElementById("twittext").style.display="inline";
};
};
function hideWebLink(hide){
if(hide = "true"){
document.admin.webLink.style.display="none";
document.getElementById("webtext").style.display="none";
};
else if(hide = "false"){
document.admin.webLink.style.display="block"开发者_C百科;
document.getElementById("webtext").style.display="inline";
};
};
function toggleFormElements(){
if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "homePage"){
hideTitle("true");
hideSocMedLinks("true");
hideWebLink("true");
};
else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "socialMedia"){
hideTitle("false");
hideSocMedLinks("false");
hideWebLink("true");
};
else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "webDesign"){
hideTitle("false");
hideSocMedLinks("true");
hideWebLink("false");
};
};
You need to use double equals (==) to test for equality. The single equals that is currently in your if statements will assign the value that you think you are testing for and evaluate to true. In other words, for almost all values of 'hide' the if will execute, not just the value "true".
function hideSocMedLinks(hide){
if(hide == "true"){
document.admin.facebookLink.style.display="none";
document.admin.twitterLink.style.display="none";
document.getElementById("fbtext").style.display="none";
document.getElementById("twittext").style.display="none";
}
else if(hide == "false"){
document.admin.facebookLink.style.display="block";
document.admin.twitterLink.style.display="block";
document.getElementById("fbtext").style.display="inline";
document.getElementById("twittext").style.display="inline";
}
}
You have semi-colons (;
) after your if statements - that could be the cause of your syntax issues. See the arrows below:
function hideTitle(hide){
if(hide = "true"){
document.admin.title.style.display="none";
document.getElementById("titleText").style.display="none";
}; <----
else if(hide = "false"){
document.admin.title.style.display="inline";
document.getElementById("titleText").style.display="inline";
}; <----
};
Removing the unnecessary semi-colons should solve the issue.
function hideTitle(hide){
if(hide = "true"){
document.admin.title.style.display="none";
document.getElementById("titleText").style.display="none";
}
else if(hide = "false"){
document.admin.title.style.display="inline";
document.getElementById("titleText").style.display="inline";
}
}
function hideSocMedLinks(hide){
if(hide = "true"){
document.admin.facebookLink.style.display="none";
document.admin.twitterLink.style.display="none";
document.getElementById("fbtext").style.display="none";
document.getElementById("twittext").style.display="none";
}
else if(hide = "false"){
document.admin.facebookLink.style.display="block";
document.admin.twitterLink.style.display="block";
document.getElementById("fbtext").style.display="inline";
document.getElementById("twittext").style.display="inline";
}
}
function hideWebLink(hide){
if(hide = "true"){
document.admin.webLink.style.display="none";
document.getElementById("webtext").style.display="none";
}
else if(hide = "false"){
document.admin.webLink.style.display="block";
document.getElementById("webtext").style.display="inline";
}
}
function toggleFormElements(){
if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "homePage"){
hideTitle("true");
hideSocMedLinks("true");
hideWebLink("true");
}
else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "socialMedia"){
hideTitle("false");
hideSocMedLinks("false");
hideWebLink("true");
}
else if(document.admin.pageType.options[document.admin.pageType.selectedIndex].value == "webDesign"){
hideTitle("false");
hideSocMedLinks("true");
hideWebLink("false");
}
}
You shouldn't put ;
s after code blocks.
In particular, the ;
s after your if
s end the if
blocks, causing the else
s to be unattached.
Remove the semicolon after the closing }
in all your if / else
blocks.
Also, are you passing the boolean value true/false
to your function or are you passing the string "true"/"false"
?
// This is incorrect
if (stuff) {
// stuff
};
else if {
// etc...
};
// Should be
if (stuff) {
// stuff
}
else if {
// etc...
}
As others have mentioned, the semicolons (;
) after the closing braces (}
) before each else
should be removed, but one other problem I can see is that you're using a single equals inside your if
statements. In Javascript a single equals sign will always attempt assign to the left hand side. What you want for comparisons is double or triple equals (==
or ===
).
精彩评论