/    Sign up×
Community /Pin to ProfileBookmark

[HELP!!!]New to javascript

Hey guys,

I’m new to Javascript and I’m trying to make a calculator without using the “eval” function. I am using jsbin.com to write my code and want to use the HTML and JavaScript partition, I got everything written in the HTML partition at the moment but i would like to have the JavaScript and the HTML seperated.Another problem is the “=” button, I have no idea how i can get the operation to work without eval, here is my code :

<FORM NAME=”Calculator”>
<TABLE BORDER=2>
<tr>
<td>
<input type = “text” Name = “Input” size =”15″>
</br>
</td>
</tr>

<tr>
<td>
<input type = “button” Name =
“seven” Value = “7” OnCLick = “Calculator.Input.value += ‘7’”>

<input type = “button” Name =
“eight” Value = “8” OnCLick = “Calculator.Input.value += ‘8’”>

<input type = “button” Name =
“nine” Value = “9”OnCLick = “Calculator.Input.value += ‘9’”>

<input type = “button” Name =
“divide” Value = “/”OnCLick = “Calculator.Input.value += ‘/'”>

</br>

<input type = “button” Name =
“four” Value = “4” OnCLick = “Calculator.Input.value += ‘4’” >

<input type = “button” Name =
“five” Value = “5” OnCLick = “Calculator.Input.value += ‘5’” >

<input type = “button” Name =
“six” Value = “6” OnCLick = “Calculator.Input.value += ‘6’” >

<input type = “button” Name =
“multiplication” Value = “*” OnCLick = “Calculator.Input.value += ‘*‘” >

</br>

<input type = “button” Name =
“one” Value = “1” OnCLick = “Calculator.Input.value += ‘1’” >

<input type = “button” Name =
“two” Value = “2” OnCLick = “Calculator.Input.value += ‘2’” >

<input type = “button” Name =
“nine” Value = “3” OnCLick = “Calculator.Input.value += ‘3’” >

<input type = “button” Name =
“minus” Value = “-” OnCLick = “Calculator.Input.value += ‘-‘” >

</br>

<input type = “button” Name =
“zero” Value = “0” OnCLick = “Calculator.Input.value += ‘0’” >

<input type = “button” Name = “clear” Value = “c” OnCLick = “Calculator.Input.value = ‘ ‘ “>

<input type = “button” Name =
“equal” Value = “=”>

<input type = “button” Name =
“plus” Value = “+” OnCLick = “Calculator.Input.value += ‘+'” >

</td>
</tr>

Thanks in advance

to post a comment
JavaScript

1 Comments(s)

Copy linkTweet thisAlerts:
@Ay__351_eMay 29.2013 —  <br/>
&lt;html&gt;
&lt;head&gt;

&lt;script type="text/javascript"&gt;
// http://jsbin.com/

// http://www.webdeveloper.com/forum/showthread.php?278653-HELP!!!-New-to-javascript

// http://www.w3schools.com/jsref/jsref_unshift.asp
// http://www.w3schools.com/jsref/jsref_obj_array.asp
// http://www.w3schools.com/jsref/jsref_join.asp

// http://www.w3schools.com/jsref/jsref_obj_regexp.asp

// http://www.w3schools.com/jsref/jsref_obj_string.asp
// http://www.w3schools.com/jsref/jsref_replace.asp
// http://www.w3schools.com/jsref/jsref_match.asp


/*
Soldan sa&amp;#287;a zihinsel ç&amp;#305;karma i&amp;#351;lemi de bir bak&amp;#305;ma toplama i&amp;#351;lemi gibidir. Bu metot, ç&amp;#305;kanla hangi say&amp;#305;y&amp;#305; toplamal&amp;#305;y&amp;#305;m ki eksileni elde edeyim &amp;#351;eklinde bir mant&amp;#305;&amp;#287;a dayanmaktad&amp;#305;r.Zihinsel Matematik Teknikleri (2. kitap), sayfa : 17
*/

function subtract (a,b) {
if(Number(a) &lt; Number(b) ) { alert( 'ilk say&amp;#305; büyük, ikinci say&amp;#305; küçük olmal&amp;#305;' ); return false; }

// a say&amp;#305;s&amp;#305;n&amp;#305; eksilen isimli dizinin içine atal&amp;#305;m. b say&amp;#305;s&amp;#305;n&amp;#305; da ç&amp;#305;kan isimli bir dizinin içine atal&amp;#305;m.

var eksilen = a.split('');
//alert(eksilen);
alert(typeof(eksilen[0]))
var cikan = b.split('');
// alert(cikan);


// A eleman say&amp;#305;s B den çok ise, B nin eleman say&amp;#305;s&amp;#305;n A ya e&amp;#351;itlemek için B eleman&amp;#305;nn ba&amp;#351; k&amp;#305;sm&amp;#305;na 0 ekleyelim:

while(eksilen.length &gt; cikan.length) { cikan.unshift(0); }
//alert(cikan.length);
//alert(cikan);

var i ;
var kalan = []; // i&amp;#351;lemin sonucunda kalan say&amp;#305;y&amp;#305; bu diziye yerle&amp;#351;tirece&amp;#287;iz.


for(i=0; i&lt; eksilen.length; i++ ) {
if(eksilen[i] &gt;= cikan[i]) { kalan[i] = eksilen[i] - cikan[i];}
if( eksilen[i] &lt; cikan[i]) { <br/>
kalan[i-1]= kalan[i-1] - 1; // alert( 'kalan[i-1] = '+kalan[i-1]);
eksilen[i]= Number(eksilen[i]) + 10; // alert( 'eksilen[i]='+ eksilen[i] );
kalan[i] = eksilen[i] - cikan[i]; // alert( 'kalan[i]= '+ kalan[i]);
}
}
// alert(kalan);
// alert( typeof( kalan.join('') ) );
// Ba&amp;#351;lang&amp;#305;çtaki 0 lar&amp;#305; yok edelim:
// alert(kalan.join('').replace(/^0+/,'') );

return kalan.join('').replace(/^0+/,'') ;
}



function add (c, d) {
var num = c.split('');
var num2= d.split('');
// num ve num2 dizilerinin eleman say&amp;#305;lar&amp;#305;n&amp;#305; e&amp;#351;itlemek için ba&amp;#351;lang&amp;#305;ca 0 ekliyoruz.
while(num.length &gt; num2.length) { num2.unshift(0); }

while(num.length &lt; num2.length) { num.unshift(0); }

var i, L = num.length-1;
var toplam = [];
var b, elde=0;

for(i=L; i&gt;=0; i--) {

b = Number(num[i]) + Number(num2[i]) + elde;
if(i == 0 ) { toplam[i]= b ; }
else { toplam[i] = b%10 ; }

if(b&gt;9 &amp;&amp; i !=0 ) { elde = parseInt(b/10); }

if(b &lt; 10) { elde =0; }

}

// alert(toplam);
// alert( toplam.join('') );
return toplam.join('');
}



function temizle (bu) {
var el = document.getElementById('Input');
el.value = bu;
}


function yaz (bu) {
var el = document.getElementById('Input');
el.value += bu;
}


function hesapla () {
var el = document.getElementById('Input');
var s = el.value;
var n = s.split(/[*+-/]/);
// alert('n= '+n);
// alert('n[0]= '+ n[0]);
// alert('n[1]= '+n[1]);
var sign = s.match(/[*+-/]/);
// alert('sign ='+sign);

if(sign == '+' ) {el.value = Number(n[0]) + Number( n[1]); }
// or
// if(sign == '+' ) {el.value = add( n[0], n[1]); }


// if(sign == '-' ) {el.value = Number(n[0]) - Number( n[1]); }
// or
if(sign == '-' ) {el.value = subtract( n[0], n[1] ); }

if(sign == '*' ) {el.value = Number(n[0]) * Number( n[1]); }
if(sign == '/' ) {el.value = Number(n[0]) / Number( n[1]); }


}


&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;FORM NAME="Calculator"&gt;
&lt;TABLE BORDER=2&gt;
&lt;tr&gt;
&lt;td&gt;
&lt;input type = "text" Name = "Input" id="Input" size ="15"&gt;
&lt;/br&gt;
&lt;/td&gt;
&lt;/tr&gt;

&lt;tr&gt;
&lt;td&gt;
&lt;input type = "button" Name =
"seven" Value = "7" OnCLick = "yaz(this.value)"&gt;

&lt;input type = "button" Name =
"eight" Value = "8" OnCLick = "yaz(this.value)"&gt;

&lt;input type = "button" Name =
"nine" Value = "9" OnCLick = "yaz(this.value)"&gt;

&lt;input type = "button" Name =
"divide" Value = "/" OnCLick = "yaz(this.value); "&gt;

&lt;/br&gt;

&lt;input type = "button" Name =
"four" Value = "4" OnCLick = "yaz(this.value)"&gt;

&lt;input type = "button" Name =
"five" Value = "5" OnCLick = "yaz(this.value)"&gt;

&lt;input type = "button" Name =
"six" Value = "6" OnCLick = "yaz(this.value)"&gt;

&lt;input type = "button" Name =
"multiplication" Value = "*" OnCLick = "yaz(this.value);" &gt;

&lt;/br&gt;

&lt;input type = "button" Name =
"one" Value = "1" OnCLick = "yaz(this.value)" &gt;

&lt;input type = "button" Name =
"two" Value = "2" OnCLick = "yaz(this.value)" &gt;

&lt;input type = "button" Name =
"nine" Value = "3" OnCLick = "yaz(this.value)" &gt;

&lt;input type = "button" Name =
"minus" Value = "-" OnCLick = "yaz(this.value);" &gt;


&lt;/br&gt;

&lt;input type = "button" Name =
"zero" Value = "0" OnCLick = "yaz(this.value)" &gt;

&lt;input type = "button" Name = "clear" Value = "c" OnCLick = "temizle('')"&gt;

&lt;input type = "button" Name =
"equal" Value = "=" onclick="hesapla ()"&gt;

&lt;input type = "button" Name =
"plus" Value = "+" OnCLick = "yaz(this.value)" &gt;

&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
&lt;/form&gt;




<br/>
&lt;script type="text/javascript"&gt;
//multiplication

// çarpma i&amp;#351;lemi

/*
var num = [ 1, 2];
var num2 = [ 2, 4, 5,6];
*/

/*
var num = [1,2,3,1];
var num2 = [2,4,1,3];
// 2970403
*/
/*
var num = [2,1,2,3,1];
var num2 = [5,2,4,2,2];
//1112971482
*/

var num = [3,4,9,1,0,5,2,7,6,8];
var num2 = [5,8,2,9,7,3,6,0,4,1];
// 20351916142642411488

//var B = [];

while(num.length &gt; num2.length) { num2.unshift(0); }
while(num2.length &gt; num.length) { num.unshift(0); }

var netice = [];
var i, k, t, basamak, elde = 0, L = num.length -1;
for(i=L; i&gt;=0; i--) {
basamak = elde;

t=i;
for(k = L; k&gt;=i; k--) {
basamak += num[k] * num2[t];
t++;
}
if(basamak&gt;9) { elde = parseInt(basamak/10); netice.unshift(basamak % 10); }
if(basamak &lt; 10) { elde = 0; netice.unshift(basamak) ; }
//B[B.length]= basamak;
}

// alert(netice);
// alert('döngüden önce basamak = '+basamak);
var p, r = L - 1, u = r, y;
for( p= r; p &gt;=0; p--) {
y=p;
basamak = elde;
for( m = 0; m&lt;=p; m++) {
basamak += num[m] * num2[y]; y--; // alert(basamak);
}

if(basamak&gt;9) { elde = parseInt(basamak/10); netice.unshift(basamak % 10); }
if(basamak &lt; 10) { elde = 0; netice.unshift(basamak) ; }

//B[B.length]= basamak;
}

if(elde &gt; 0) {
//alert( 'elde = '+elde);
netice.unshift(elde);
}

//alert( 'B dizisinin degeri = '+ B );
// alert(netice);
alert(netice.join('') );


document.write(netice.join(''));

&lt;/script&gt;

×

Success!

Help @tech 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.2,
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,
)...