/    Sign up×
Community /Pin to ProfileBookmark

Javascript help

Copy linkTweet thisAlerts:
Mar 02.2018

I am new to javascript so please do not bash my code. It is working. I would like help adding a back button that removes that last value entered into the FinishTS() function. If someone could help I would appreciate it. Thank you in advance. Below is my code.

<style>
.div{
margin: auto;
width: 60%;
padding: 10px;
border: 3px solid 000000;
text-align: center;
font-family: Gotham, ‘Helvetica Neue’, Helvetica, Arial, ‘sans-serif’;
margin-top: 3%;
background-color: transparent;
text-decoration-color: black;
}
.button {
color: rgb(191, 218, 255); font-size: 15px; line-height: 15px; padding: 12px; margin: 5px; border-radius: 28px; font-family: Georgia, serif; font-weight: normal; text-decoration: none; font-style: normal; font-variant: normal; text-transform: none; background-image: linear-gradient(to right, rgb(28, 110, 164) 0%, rgb(35, 136, 203) 50%, rgb(20, 78, 117) 100%); box-shadow: rgb(0, 0, 0) 5px 5px 15px 5px; border: 2px solid rgb(28, 110, 164); display: inline-block;}
.button:hover {
background: #1C6EA4; }
.button:active {
background: #144E75; }
</style>
</head>
<script>
function TSOutput1(txt) {
var button1 = document.getElementById(“result1”).value;
button1=button1 + txt;
document.getElementById(‘result1’).value=button1;

var button2 = document.getElementById(“result2”).value;
button2=button2 + txt;
document.getElementById(‘result2’).value=button2;

}

function InternetTS0() {
var x = document.getElementById(“divbutton1”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function InternetTS() {
var x = document.getElementById(“Intbutton2”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function InternetTS2() {
var x = document.getElementById(“Intbutton3”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function InternetTS3() {
var x = document.getElementById(“Intbutton4”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function InternetTS4() {
var x = document.getElementById(“Intbutton5”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function InternetTS5() {
var x = document.getElementById(“Intbutton6”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function InternetTS6() {
var x = document.getElementById(“Intbutton7”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CameraTS() {
var x = document.getElementById(“divbutton2”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS() {
var x = document.getElementById(“divbutton2”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS1() {
var x = document.getElementById(“Phonebutton1”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS2() {
var x = document.getElementById(“Phonebutton2”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS3() {
var x = document.getElementById(“Phonebutton3”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS4() {
var x = document.getElementById(“Phonebutton4”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS5() {
var x = document.getElementById(“Phonebutton5”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS6() {
var x = document.getElementById(“Phonebutton6”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS7() {
var x = document.getElementById(“Phonebutton7”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS8() {
var x = document.getElementById(“Phonebutton8”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function PhoneTS9() {
var x = document.getElementById(“Phonebutton9”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS1() {
var x = document.getElementById(“Cambutton1”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS2() {
var x = document.getElementById(“Cambutton2”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS3() {
var x = document.getElementById(“Cambutton3”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS4() {
var x = document.getElementById(“Cambutton4”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS5() {
var x = document.getElementById(“Cambutton5”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS6() {
var x = document.getElementById(“Cambutton6”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS7() {
var x = document.getElementById(“Cambutton7”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS8() {
var x = document.getElementById(“Cambutton8”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS9() {
var x = document.getElementById(“Cambutton9”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS10() {
var x = document.getElementById(“Cambutton10”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS11() {
var x = document.getElementById(“Cambutton11”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS12() {
var x = document.getElementById(“Cambutton12”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS13() {
var x = document.getElementById(“Cambutton13”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS14() {
var x = document.getElementById(“Cambutton14”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function CamTS15() {
var x = document.getElementById(“Cambutton15”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

function FinishTS() {
var x = document.getElementById(“result”);
if (x.style.display === “none”) {
x.style.display = “block”;
} else {
x.style.display = “none”;
}

}

</script>

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@JMRKERMar 02.2018 — To be of much help it would be nice if you included the HTML along with the CSS and JS you provided. I don't have time to try to recreate your form.

One thing to note, you have 31 functions that appear to do the same thing.
<i>
</i>function InternetTS() {
var x = document.getElementById("Intbutton2");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}

function InternetTS2() {
var x = document.getElementById("Intbutton3");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}

etc.

I would suggest combining them into one function that can be reused, as in:
<i>
</i>function toggleButton(IDS) {
var x = document.getElementById(IDS);
if (x.style.display === "none") { x.style.display = "block"; }
else { x.style.display = "none"; }
}

Called with the HTML of: toggleButton('Initbutton2');

Note also that you should enclose your script between [ code] and [ /code] tags (without the spaces) to preserve the formatting of your code.

It also makes it much easier to read, copy and past for testing purposes.

BTW, welcome to the forums ?
Copy linkTweet thisAlerts:
@rootMar 03.2018 — Yes, DRY. Don't Repeat Yourself

A simple toggle routine that you call to toggle the state of that item. Call it with the target ID to change that elements state
function toggleTarget( targetName ) {
var x = document.getElementById( targetName );
x.style.display = (x.style.display === "none") ? "block" : "none";
}

as JMRKER pointed out, can be replaced by one function called with the right parameters, you can save yourself a hell of a lot of typing...

Also, it is far better to have CSS rules set and then simply add and remove those [B]className[/B]s.

AND....

Programming for a mobile device may use some JavaScript... however, these devices use libraries and frameworks to program their interfaces, you will find that you will need to be using a whole suite of commands for running an app on a mobile device as it has features not availiable in PC's and PC's have things that are not available in tablets...

Try google [B]programming a mobile device[/B] or similar and you will see these libraries and frameworks pop up, some items need an IDE installed, good luck, I tried, didn't like my PC, never ran, so I abandoned mobile programming.

Good Luck.
×

Success!

Help @rehrnsberger spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.1,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,
)...