View Full Version : Javascript calculator

05-12-2007, 12:36 AM
I've made numerous different kinds of javascript calucators, like:
Absolute Value
Exponent Calculator
Slope Calculator

And, I used prompts for them, but is it possible to get the same result by using input already on the page, if so please share.


05-12-2007, 12:43 AM
Sure it's possible, you can pretty much do anything with any element on the page. You need to be more specific in what you want the calculator to do.

05-12-2007, 12:53 AM
Ok, lemme show you...go to slopecalc.5u.com, the home page is what I want all the other calculator to look like also, if you go to the other pages you can see that they all work from prompts

05-12-2007, 01:27 AM
Okay, well add HTML markup for the input fields, a button, and a results div. Give each element a unique ID. Attach an 'onclick' observer to the button element that calls a function that you've included. Here is a very simple example:

<script text="javascript/text"><!--
var addListener = function(element, name, observer) {
if (element.addEventListener) {
element.addEventListener(name, observer, false);
else if (element.attachEvent) {
element.attachEvent('on' + name, observer);

var addition = function() {
var v1 = document.getElementById("val1").value;
var v2 = document.getElementById("val2").value;
var r = document.getElementById("results");
r.innerHTML = parseInt(v1) + parseInt(v2);

var onPageLoad = function() {
var btn = document.getElementById("myButton");
addListener(btn, 'click', addition);

<body onload="onPageLoad();">
<form action="javascript:void(null)">
<input id="val1" type="text" value="" />
<input id="val2" type="text" value="" />
<input id="myButton" type="button" value="Add" />
<div id="results"></div>

that should be enough for you to get started.

05-12-2007, 01:29 AM
Thanks so much! :thumbsup: