乘和元素选择

Question

不是那么容易解释中添加文本区域的值，所以让我贴一点代码：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" ></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     calculateSum(); 
     $(".txt").live("keydown keyup", function() { 
      calculateSum(); 
     }); 
    }); 

    function calculateSum() { 
     var sum = 0; 
     // Iterate through each textboxes and add the values. 
     $(".txt").each(function() { 
      // Add only if the value is number. 
      if (!isNaN(this.value) && this.value.length != 0) { 
       sum += parseFloat(this.value); 
      } 
      else if (this.value.length != 0){ 
       $(this).css("background-color", "red"); 
      } 
     }); 
     $("#currentCost").html(sum.toFixed(2)); 
    } 
</script> 

首先，我想更新代码以使用最最近的jQuery版本，因为它只适用于1.5我认为。 （目前，它只会增加值中的所有文本域和更新span元素）

<td> 
    <select name="struct[213]"> 
     <option selected="selected" value="0"></option> 
     <option value="2" data-price="4000">A</option> 
     <option value="3" data-price="6000">B</option> 
     <option value="4" data-price="8000">C</option> 
     <option value="7" data-price="15000">D</option> 
     <option value="11" data-price="80000">E</option> 
    </select> 
</td> 
<td> 
    <input type="text" size="2" maxlength="4" class="txt" 
     name="numUnits[213]" value="0"> 
</td> 

这就是文字区域之一，都遵循类似的方式，并且我想与他们做的是乘以在textarea中输入的数字选择数据价格（所有textareas和选择在名称元素后面都有相同的[]]，然后我希望所有这些产品在跨度中加在一起#currentCost：

<td class="L1" width="175"> 
    Cost: <span class="redmoney" id="currentCost" name="currentCost">$0</span> 
</td> 

如果这意味着什么...

Answer 1

尝试

$(document).ready(function() { 
    calculateSum(); 
    //register change handler for input and select elements 
    $(document).on("keyup, change", ".txt, select", function() { 
     calculateSum(); 
    }); 
}); 

function calculateSum() { 
    var sum = 0; 
    $(".txt").each(function() { 
     var value = $.trim(this.value); 
     if (value.length && !isNaN(value)) { 
      //find the select in the previous td and multiply the value 
      sum += parseFloat(value) * ($(this).parent().prev().find('option:selected').data('price') || 0); 
      //change back the color 
      $(this).css("background-color", ""); 
     } else if (this.value.length != 0) { 
      $(this).css("background-color", "red"); 
     } 
    }); 
    $("#currentCost").html(sum.toFixed(2)); 
} 

演示：Fiddle