www.webdeveloper.com
Results 1 to 2 of 2

Thread: [HELP!!!]New to javascript

  1. #1
    Join Date
    May 2013
    Posts
    1

    Exclamation [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

  2. #2
    Join Date
    Sep 2007
    Posts
    301
    Code:
      
    <html>
    <head>
    
    <script type="text/javascript">
    // 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ğa zihinsel çıkarma işlemi de bir bakıma toplama işlemi gibidir. Bu metot, çıkanla hangi sayıyı toplamalıyım ki eksileni elde edeyim şeklinde bir mantığa dayanmaktadır.Zihinsel Matematik Teknikleri (2. kitap), sayfa : 17
    */
    
    function subtract (a,b) {
    if(Number(a) < Number(b) ) { alert( 'ilk sayı büyük, ikinci sayı küçük olmalı' ); return false; }
    
    // a sayısını eksilen isimli dizinin içine atalım. b sayısını da çıkan isimli bir dizinin içine atalım.
    
    var eksilen = a.split(''); 
    //alert(eksilen);
    alert(typeof(eksilen[0]))
    var cikan = b.split(''); 
    // alert(cikan);
    
    
    // A eleman sayıs B den çok ise, B nin eleman sayısın A ya eşitlemek için B elemanınn baş kısmına 0 ekleyelim:
    
    while(eksilen.length > cikan.length) { cikan.unshift(0); }
    //alert(cikan.length); 
    //alert(cikan);
    
    var i ;
    var kalan = [];  // işlemin sonucunda kalan sayıyı bu diziye yerleştireceğiz.
    
    
    for(i=0; i< eksilen.length; i++ ) {
     if(eksilen[i] >= cikan[i]) { kalan[i]  = eksilen[i] - cikan[i];}
     if( eksilen[i] < cikan[i]) {  
        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şlangıçtaki 0 ları 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ılarını eşitlemek için başlangıca 0 ekliyoruz.
    while(num.length > num2.length) { num2.unshift(0); }
    
    while(num.length < num2.length) { num.unshift(0); }
    
    var i, L = num.length-1;
    var toplam = [];
    var b, elde=0;
    
    for(i=L; i>=0; i--) {
    
    b = Number(num[i]) + Number(num2[i]) + elde;
    if(i == 0 ) { toplam[i]= b ; }
    else { toplam[i] = b%10 ;  }
    
    if(b>9 && i !=0 ) { elde = parseInt(b/10); }
    
    if(b < 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]); } 
    
    
    }
    
    
    </script>
    </head>
    <body>
    
    <FORM NAME="Calculator">
    <TABLE BORDER=2>
    <tr>
    <td>
    <input type = "text" Name = "Input" id="Input" size ="15">
    </br>
    </td>
    </tr>
    
    <tr>
    <td>
    <input type = "button" Name =
    "seven" Value = "7" OnCLick = "yaz(this.value)">
    
    <input type = "button" Name =
    "eight" Value = "8" OnCLick = "yaz(this.value)">
    
    <input type = "button" Name =
    "nine" Value = "9" OnCLick = "yaz(this.value)">
    
    <input type = "button" Name =
    "divide" Value = "/" OnCLick = "yaz(this.value); ">
    
    </br>
    
    <input type = "button" Name =
    "four" Value = "4" OnCLick = "yaz(this.value)">
    
    <input type = "button" Name =
    "five" Value = "5" OnCLick = "yaz(this.value)">
    
    <input type = "button" Name =
    "six" Value = "6" OnCLick = "yaz(this.value)">
    
    <input type = "button" Name =
    "multiplication" Value = "*" OnCLick = "yaz(this.value);" >
    
    </br>
    
    <input type = "button" Name =
    "one" Value = "1" OnCLick = "yaz(this.value)" >
    
    <input type = "button" Name =
    "two" Value = "2" OnCLick = "yaz(this.value)" >
    
    <input type = "button" Name =
    "nine" Value = "3" OnCLick = "yaz(this.value)" >
    
    <input type = "button" Name =
    "minus" Value = "-" OnCLick = "yaz(this.value);" >
    
    
    </br>
    
    <input type = "button" Name =
    "zero" Value = "0" OnCLick = "yaz(this.value)" >
    
    <input type = "button" Name = "clear" Value = "c" OnCLick = "temizle('')">
    
    <input type = "button" Name =
    "equal" Value = "=" onclick="hesapla ()">
    
    <input type = "button" Name =
    "plus" Value = "+" OnCLick = "yaz(this.value)" >
    
    </td>
    </tr>
    </table>
    </form>

    Code:
      
    <script type="text/javascript">
    //multiplication
    
    // çarpma iş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 > num2.length) { num2.unshift(0); }
    while(num2.length > num.length) { num.unshift(0); }
    
    var netice = [];
    var i, k, t, basamak, elde = 0, L = num.length -1;
    for(i=L; i>=0; i--)  {
    basamak = elde;
     
     t=i;
    for(k = L; k>=i; k--) {
     basamak += num[k] * num2[t]; 
     t++;
     }
    if(basamak>9) { elde =   parseInt(basamak/10);   netice.unshift(basamak % 10); }
    if(basamak < 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 >=0; p--) {
    y=p;
     basamak = elde;
      for( m = 0; m<=p; m++) {
     basamak += num[m] * num2[y];  y--;  // alert(basamak);
    }
    
    if(basamak>9) { elde =   parseInt(basamak/10);  netice.unshift(basamak % 10); }
    if(basamak < 10) { elde = 0; netice.unshift(basamak) ; }
    
    //B[B.length]= basamak;
    }
    
    if(elde > 0) { 
    //alert( 'elde = '+elde); 
    netice.unshift(elde); 
    }
     
    //alert( 'B dizisinin degeri = '+ B );
    // alert(netice);
    alert(netice.join('') );
    
    
    document.write(netice.join(''));
    
    </script>
    İyiliği emret. Kötülükten alıkoy. (31/16)

    hasbunallahuVeNimelVekil++

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles