Tolong pilih kategori sesuai, jenis posting (pertanyaan atau bukan) dan sertakan tag/topik yang sesuai misal komputer, php, mysql, dll.
Promosi atau posting tidak pada tempatnya akan kami hapus.
Mencantumkan kode program di posting Anda, tolong ikuti aturan yang sesuai, baca http://diskusiweb.com/discussion/39204/aturan-cara-menyisipkan-kode-program-di-diskusiweb

Baca cara posting gambar/image di post Anda: http://www.diskusiweb.com/discussion/47345/cara-menyisipkan-menyertakan-image-pada-posting/p1

[ASK]penjumlahan 2 input tanpa delay dengan jquery

hi suhu2 sekalian. ane ada problem nih. ane mau menjumlahkan bilangan secara realtime dengan input berbeda. input pertama dengan menggunakan radio-button dan yang ke dua menggunakan hyperlink.

code yang ane buat karena di tampung dulu di class yang sama jadi ada delaynya. sehingga harus 2 kali klik baru menjumlahkan. ane pengennya 1x klik langsung nambahin. berikut ane lampirin code yang ane buat

ini code jquerynya

Tanggapan

  • ===================================================================================================
          <script type="text/javascript">
                        $(document).ready(function() {
      $('.thumbnail').live("click", function() {
       var g = $(this).attr('alt');
      var e = $(this).attr('href');
     calculateSum();
        $('#mainImage').hide();
      
    $('#mainImage').html('<img class="pret" alt="'+g+'"
    src="'+e+'">').fadeIn();
    return false;
     });
                                                   
      $('.add2:checked').change(function(){
       var m = $(this).attr('alt');
       var a = $(this).attr('value');
                                                       
      calculateSum();
       $('#cau').hide();
         $('#cau').html('<div
    name="'+a+'" class="pret" alt="'+m+'"></div>').fadeIn();
                                                        return false;
      });
                           
    });
      function calculateSum() {
     var sum = 0;
        $(".pret").each(function() {
        sum += parseFloat($(this).attr('alt'));
       });
    $('#usertotal').html('PRICE : IDR  '+ sum);
        }
          </script>
    ================================================================================================


  • edited March 2013


    ini code htmlnya

    <pre>
           <a id="add1" class="thumbnail"  alt="100000" href="">one</a>
            <br>
            <a id="add1" class="thumbnail"  alt="150000" href="">two</a>
            <br>
            <a id="add1" class="thumbnail"  alt="90000" href="">theree</a>
         
        <hr>
        <hr>
        <input class="add2" type="radio" value="1" alt="100000" name="material">
        LACE
        <br>
        <input class="add2" type="radio" value="2" alt="200000" name="material">
        LACE - LEATHER
        <br>
        <input class="add2" type="radio" value="3" alt="150000" name="material">
        LACE - SUEDE
        <br>
        <hr>
        <hr>
                                <img src="" alt="0" id="mainImage" class="pret">
                                <div id="cau"  alt="0"class="pret"></div>
                                <div id="usertotal"> PRICE  :  IDR  0</div>
    </pre>

    thanks atas jawaban suhu2 sekalian. semoga ilmunya berkah :)
  • maksudnya gimana ?

    kenapa yg <a> kagak sekalian pake radio saja ?
    pilihan pake <a> ntar justru bikin koding jadi lebih ribet

    btw,
    dalam 1 halaman html, kagak boleh ada id yg sama
  • edited March 2013
    gw kagak tau, apa yg kaya gini yg elo maksud
    <style>
    a {text-decoration:none;color:#000;}
    .selected {font-weight:bold;color:#f00;}
    </style>
    <script>
    function switch_a(t) {
    for(i=1;i<=3;i++) document.getElementById("a"+i).className="";
    t.className="selected";
    calc();
    return false;
    }
    function calc() {
    var a=0,r=0;
     
    for(i=1;i<=3;i++) {
    if(document.getElementById("a"+i).className=="selected") a=parseInt(document.getElementById("a"+i).getAttribute("alt"));
    if(document.getElementById("r"+i).checked) r=parseInt(document.getElementById("r"+i).value);
    }
    document.getElementById("calc").innerHTML=a+r;
    }
    </script>
    <a id="a1" alt="1" href="" onclick="return switch_a(this)" class="selected">1</a><br>
    <a id="a2" alt="2" href="" onclick="return switch_a(this)">2</a><br>
    <a id="a3" alt="3" href="" onclick="return switch_a(this)">3</a><br>
    <input id="r1" type=radio name="r" value=1 onclick="calc()" checked>1<br>
    <input id="r2" type=radio name="r" value=2 onclick="calc()">2<br>
    <input id="r3" type=radio name="r" value=3 onclick="calc()">3<br>
    Jumlah : <span id="calc"/>
    <script>calc();</script>

    tapi tetep, tiap pilihan harus ada defaultnya
    - yg <a> pake class selected
    - yg radio pake checked

    kalo kagak mau ada default, otomatis dianggap 0 : var a=0,r=0;

    dan kagak boleh ada elemen punya id sama di 1 halaman

    pake <a> ribet, karena tiap ganti pilihan harus set ulang semua atribut <a> yg ada buat menandai mana yg dipilih
    mending pake radio, toh pilihannya hanya bisa 1 dari sekian opsi
  • weh.. pak boo lagi. mantap.. mampir ke posting saya ya.

    murid mau tanya lagi nih. :D

  • wuih ada suhu boo jawab. salam suhu :)

    pake js pure lagi ^:)^

    idenya itu pas si hyperlink di klik itu ngambil si href="" terus ganti gambarnya. dan disaat yang sama

    melakukan penambahan sesuai dengan yang di klik. itu makannya pake hyperlink suhu. nilai awalnya adalah 0.

    lalu di radio-button itu ngambil alt yang ditambahin sama hyperlink yang udah di pilih tadi.

    makannya yang satu pake hyperlink yang satu pake radio-button.

    gitu suhu.
  • yg hyperlink gw liat tetep bisa pake radio
    toh utk event nya elo yg hyperlink pun pake event onclick
    pilihan cuma 1 dari sekian opsi

    tapi terserah lah, gw cuma ngasih saran

    ttg masalahnya bener kaya gitu ?
  • iya om boo. thanx berat :D
Sign In or Register to comment.