如何輸入一些動畫計算的數字？

-1

我有這個腳本，我想輸入一些動畫爲數，但我不知道如何解決這個問題。如何輸入一些動畫計算的數字？

$('#choose').change(function() { 
 
     if($(this).val() == '1') { 
 
     document.getElementById('harga').innerHTML = "5000"; 
 
     } 
 
     if($(this).val() == '2') { 
 
     document.getElementById('harga').innerHTML = "10000"; 
 
     } 
 
     if($(this).val() == '3') { 
 
     document.getElementById('harga').innerHTML = "30000"; 
 
     } 
 
})

<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js"></script> 
 
    <div class="harga" id="harga"> 5000 </div> 
 
    <select id="choose"> 
 
     <option value="1">choose 1</option> 
 
     <option value="2">choose 2</option> 
 
     <option value="3">choose 3</option> 
 
    </select>

來源

2016-08-23 Imam

可以你澄清什麼'一些動畫'可能是 –

你的意思是你想讓用戶看到'harga'元素' s值從其當前值向上或向下遞增到新值，如已加速的數字時鐘？（如果是這樣，你想要動畫需要多長時間？如果用戶在前一個動畫完成之前選擇另一個值，該怎麼辦？）提示：一個基於'setTimeout（）'的僞循環是實現類似的最簡單的方法。 – nnnnnn

你能寫劇本嗎，我還是很困惑你指導什麼。 – Imam

如果你的意思是動畫作爲計數器數向上或向下，

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="harga" id="harga"> 5000 </div> 
 
<select id="choose"> 
 
    <option value="1">choose 1</option> 
 
    <option value="2">choose 2</option> 
 
    <option value="3">choose 3</option> 
 
</select> 
 

 

 
<script type="text/javascript"> 
 
var options = {"1":5000,"2":10000,"3":30000,} 
 
var amount = options["1"]; //default 
 

 
$('#choose').change(function() { 
 
    selected_amount = options[$(this).val()]; 
 

 
    $({ Counter: amount }).animate({ Counter: selected_amount }, { 
 
    duration: 1000, //speed 
 
    easing: 'swing', 
 
    step: function() { 
 
     $('#harga').text(Math.ceil(this.Counter)); 
 
    }, 
 
    complete: function(){ 
 
     $('#harga').text(selected_amount); 
 
     amount = selected_amount; 
 
    } 
 
    }); 
 
    
 
}); 
 
</script>

來源

2016-08-23 02:56:12

好的，非常感謝你幫助我。：d – Imam

<script type="text/javascript"> 
$('#choose').change(function() { 
    if($(this).val() == '1') { 
    document.getElementById('harga').innerHTML = "5000"; 
    } 
    if($(this).val() == '2') { 
    document.getElementById('harga').innerHTML = "10000"; 
    } 
    if($(this).val() == '3') { 
    document.getElementById('harga').innerHTML = "30000"; 
    } 
}) 
</script>

你可以把以下，使其淡出第一，那麼在使用基本的jQuery褪色。否則，你可能會等使用Animate CSS

$("#harga").fadeOut(400,function(){ 
    $(this).html("5000").fadeIn(); 
}); 

<script type="text/javascript"> 
$('#choose').change(function() { 
    if($(this).val() == '1') { 

    $("#harga").fadeout(400,function(){ 
     $(this).html("5000").fadein(); 
    }); 
    //document.getElementById('harga').innerHTML = "5000"; 
    } 
    if($(this).val() == '2') { 
    document.getElementById('harga').innerHTML = "10000"; 
    } 
    if($(this).val() == '3') { 
    document.getElementById('harga').innerHTML = "30000"; 
    } 
}) 
</script>

和...希望它有助於

來源

2016-08-23 02:26:52

如何輸入一些動畫計算的數字？

回答

相關問題