View Full Version : passing plus or minus as a variable

12-26-2011, 06:34 AM
google is not my friend on this one :(

if I wanted to set a variable with radio buttons to decide whether a function adds or subtracts, I know I can't do this:


<input type="radio" name ="op" onclick="op='-'">count up: <input type="radio" name ="op" onclick="op='+'">

<script type="text/javascript">

var op;

function calc() {
start=start op 1000;

but is there something I can do, without getting all if/elsey?

12-26-2011, 06:35 AM
Yes. There is such a thing called eval (ref (http://www.w3schools.com/jsref/jsref_eval.asp))

Oh and, I would like to mention that there is nothing stopping people from altering your variable to anything that isn't '+' or '-' either. Though that shouldn't matter for this case.

12-26-2011, 06:50 AM
I don't really understand your edit, but anyway...

are you talking about this:

start=eval(start op 1000);

because I get a "missing ) after argument list" error with that...

12-26-2011, 06:54 AM
Please refer to the reference link. Seeing what you have written has shown me that you've ignored it completely.

My edit basically means that there is nothing stopping people from altering the "op" variable to any other string they want, and calling the calc() procedure. Of course, it is just food for thought for future reference when you work with things like AJAX.

12-26-2011, 06:58 AM
no, not completely - I just never used eval before because well, you know.... but anyway

start=eval("start op 1000");

gives me "missing ; before statement"
start op 1000

[edit]: just out of curiosity, how would people change the string value?

12-26-2011, 07:13 AM
Maybe I am overthinking things, but you see to have quite a bit of posts (and thanks as well). So I assumed that you would just be able to look at something and understand. My apologies if this was a false assumption.

Well op is a string. Therefore:
eval("start = start" + op + "1000;");

Well to change the value, people can use some script or input the JS in the browser URL, as such:
javascript: op = '+ 1; do_what_an_evil_adversary_does;'; calc();

12-26-2011, 07:26 AM
wow. eval() is kooky. does what you expect about half the time. no wonder people hate it so much. thanks anyway. :thumbsup:

Philip M
12-26-2011, 09:41 AM
eval() is to be used only in desperation! Is this what you want?


<input type="radio" name ="op" onclick="op='-1'; calc();">Count down: <input type="radio" name ="op" onclick="op='1'; calc()">Count up

<script type="text/javascript">

var op;
var start = 100;

function calc() {
start= start * op;
for (var i = 0; i<=9; i++) {
document.write(Math.abs(start + i) +"<br>")


It's good to hear the union jack being played at all the European Championships. - Commentator BBC Radio 2

12-26-2011, 04:34 PM
eval() is to be used only in desperation!

I think you might be preaching to the choir there :D

Math.abs looks like it might be what I'm looking for, but I can't seem to get it working. This is what I'm working on. The if/else I'm trying to replace is in red:



Input the amount of time you want to count down or up from:<br>
<input type="text" id ="hrs"> Hours<br>
<input type="text" id ="mins"> Minutes <br>
<input type="text" id ="secs"> Seconds <br>
count down: <input type="radio" checked="checked" name ="op" onclick="op='minus'">count up: <input type="radio" name ="op" onclick="op='plus'">
<input type="button" value="start timer" onclick="calc()">

<div id="days"></div>
<div id="hours"></div>
<div id="minutes"></div>
<div id="seconds"></div>
<script type="text/javascript">

var int;
var op="minus";
function calc() {
var hr=document.getElementById("hrs").value*3600000;
var mi=document.getElementById("mins").value*60000;
var se=document.getElementById("secs").value*1000;
int=setInterval(showDate, 1000)

function showDate(){
var dateString="Fri, 31 Dec 1999 00:00:00 GMT"
var d = new Date(dateString);
var mytime=d.toUTCString();
var day=mytime.substr(5,2);
if (day=="31"){day="0"}
var hour=d.getUTCHours();
var minute=d.getUTCMinutes()
var second=d.getUTCSeconds();

document.getElementById("days").innerHTML="days: "+day;
document.getElementById("hours").innerHTML="hours: "+hour;
document.getElementById("minutes").innerHTML="minutes: "+minute;
document.getElementById("seconds").innerHTML="seconds: "+second;

if (start==0){
alert("time's up!");
op=="minus"?start=start - 1000:start=start + 1000;



12-26-2011, 05:22 PM
never mind... turned out to be a lot simpler than I thought :o

count down: <input type="radio" checked="checked" name ="op" onclick="op='-1000'">count up: <input type="radio" name ="op" onclick="op='+1000'">

var op="-1000";


Old Pedant
12-27-2011, 04:38 AM
But a more general answer:

<label><input type="checkbox" onclick="op=-1"/> Count down</label>
<label><input type="checkbox" onclick="op=+1"/> Count up</label>

start = start + ( op * increment );

Did you not realize that if you multiply by either +1 or -1 then you achieve your goal of increment/decrementing by some value?

Having said that, I *really* think a more straightforward answer is the one you used in your post #9.

Though I would probably have done the following as even more straightforward:

var doIncrement = true;

function() {
if ( doIncrement ) { start += increment; } else { start -= increment; }
<label><input type="checkbox" onclick="doIncrement=false;"/> Count down</label>
<label><input type="checkbox" onclick="doIncrement=true;"/> Count up</label>

I'm much in favor of clear coding over clever coding. And I really think that JS programmers seem to avoid the simple use of boolean variables too much. There's nothing much simpler than if ( someBooleanVariable ) { ... } else { ... } so why make it more complex?

Oh...and I don't really like your "final" solution, because if you ever have to change the increment/decrement value you have to (a) change the HTML, not just the JS and (b) change two places instead of just one. But it is at least a simple solution.

Old Pedant
12-27-2011, 04:42 AM
Actually, I dislike your "final" solution for another reason: It misuses the trinary operator as an if...else.

If you are going to use the trinary operator, use it as one:

start += ( op=="minus" ? -1000 : +1000 );

But I still like the if...else... based on a simple boolean value better.

12-27-2011, 05:06 AM
Did you not realize that if you multiply by either +1 or -1 then you achieve your goal of increment/decrementing by some value?

Not really. I fact, looking back on this thread I realize that it was much more of a 7th grade math problem than a javascript problem that I was facing.

I appreciate your comments about code maintenance, and I'll bear them in mind in the future. Being that this code is for counting seconds, though, I can't really imagine a circumstance where I would want to change that 1000 figure.

thanks for the various approaches, though - it's always nice to see different ways you can do the same thing

Old Pedant
12-27-2011, 05:12 AM
Being that this code is for counting seconds, though, I can't really imagine a circumstance where I would want to change that 1000 figure.

What? You've never heard of having to adjust the calendar by a few milliseconds every year? <grin/>

Okay, point conceded on the 1000 thing.

The real problem here is that there are so darned many ways to solve the problem that in fact it boils down to picking one you like and understand. I will say that Apothem's suggestion to use eval() seems like the biggest case of overkill.