2014-01-23 30 views
2

我有一個簡短的腳本,通過乘以input值計算一個數字。該腳本工作正常,但現在我想添加if語句。例如:使用if語句輸入值jquery

HTML:

<label>Width</label><input type="text" id="width" /> 
<br> 
<label>Length</label><input type="text" id="length" /> 
<br> 
<label>Total</label><input type="text" id="total"/> 

JavaScript的:

var w = $('#width').val(); 
var l = $('#length').val(); 
var total1 = 2; 
var total2 = 3;  
if((w * l) > 5){ 
    total = total1 * (w + l); 
    parseInt($('#total').val('total')); 
} 
if((w * l) < 5){ 
    totalnew = total2 * (w + l); 
    parseInt($('#total').val(totalnew)); 
} 

所以如果(#width x #length) > 5,的(#width x #length)值將被由特定數量相乘,在這種情況下爲 「2」。

Tried to figure it out on jsfiddle

這裏是一個沒有工作的代碼中的if語句:http://jsfiddle.net/e45SJ/

我如何能實現我所期待實現與if語句的代碼我已經有了?

編輯:如何添加多個if語句?我試過這樣:http://jsfiddle.net/m2LxV/2/

+1

你想用這個完成什麼:'parseInt($('#total').val('total'));'因爲它對我沒有意義。 – jfriend00

回答

5

有多種問題

  1. 你需要做的改變處理程序時身長/身高的變化,這將被調用的計算
  2. 你是做字符串連接時你做w + l,因爲wl都是字符串值
  3. l + w是5那麼您的if條件都不滿足。
  4. parseInt($('#total').val('total'))只值total分配給元素和parseInt沒有任何意義

你需要使用一個變化處理程序

jQuery(function() { 
    var total1 = 2; 
    var total2 = 3; 

    $('#width, #length').change(function() { 
     var w = +$('#width').val(); 
     var l = +$('#length').val(); 
     var total; 
     if ((w * l) > 5) { 
      total = total1 * (w + l); 
     } else { 
      total = total2 * (w + l); 
     } 
     $('#total').val(total); 
    }) 
}) 

演示:Fiddle

+0

+是否將其轉換爲整數? – Bic

+0

@Bic是...而不是'parseInt()' –

+0

整潔。這是我不知道的。感謝:) – Bic

2

由於問題要求使用你的代碼進行修改,就是我所做的。這裏沒有什麼改變,我評論了任何看起來很難的部分。

function calculate() 
{ 
    //Parse the string value into an integer 
    var w = parseInt($('#width').val()); 
    var l = parseInt($('#length').val()); 
    var total1 = 2; 
    var total2 = 3; 

    //Perform IF 
    //suggestion to use an If {} Else 
    if((w * l) > 5) 
    { 
     //Set an internal value of total 
     var total = total1 * (w + l); 
     //Update the label's value to total 
     $('#total').val(total); 
    } 
    if((w * l) < 5) 
    { 
     //Same logic as above 
     var total = total2 * (w + l); 
     $('#total').val(total); 
    } 
} 

//Simple button event for testing 
$('button').click(function() 
        { 
        calculate(); 
        }); 

http://jsfiddle.net/LLu5s/

有些事情要記住

  • 這是使用IF ELSE邏輯塊
  • $( '#共')一個很好的例子。VAL(」總計「)轉換爲>選擇輸入元素並將其值設置爲」總計「的字符串字符串值
  • parseInt()將字符串值轉換爲整數。所以即使你從寬度和長度的字符串類型中選擇了它的值。所以執行(w + 1)實際上會導致將兩個字符串組合在一起,而不會添加數字。
+0

我想實現多個if語句沒有別的。我會怎麼做呢?另外,我怎麼能沒有計算按鈕?我試過這個:http://jsfiddle.net/m2LxV/2/ –

+0

使用一個IF {} ELSE IF {} ELSE IF {}或者一個switch語句。 http://jsfiddle.net/re6cg/ – cgatian

+0

你能告訴我如何解決我的代碼? http://jsfiddle.net/m2LxV/2/ –