在javascript中爲MVC計算函數

Question

<script type="text/javascript"> 
function compute(calcval, val) 
{ 
    var txtweeklyMailing = Number(document.getElementById(val).value); 
    var total = txtweeklyMailing * 25; 
    var _total = total.toFixed(2); 
    var _stotal = _total + ''; 
    document.getElementById(calcval).value = _stotal; 
    } 
</script> 
<p>Number of weekly mailings @Html.TextBoxFor(m => m.WeeklyMailings, new { id = "weeklymailing", onblur = "return:compute('txtpostcardperweek', 'weeklymailing')" }) x 25</p> 
<p>=</p> 
<p>@Html.TextBoxFor(m => m.PostcardsperWeek, new Dictionary<string, object>() { {"id", "txtpostcardperweek"}, { "readonly", "true" } }) Total postcards per week</p> 

我需要使用一個文本框的onblur來計算用戶輸入的值爲25，並將結果顯示在下面的文本框中。我將如何傳遞onblur事件中的文本框值？

Answer 1

嘗試這樣的：

@Html.TextBoxFor(
    m => m.WeeklyMailings, 
    new { 
     id = "weeklymailing", 
     onblur = "compute('txtpostcardperweek', 'weeklymailing')" 
    } 
) 

，或者如果你想使用不顯眼的JavaScript的使用jQuery：

<script type="text/javascript"> 
    $(function() { 
     $('#weeklymailing').blur(function() { 
      var txtweeklyMailing = Number($(this).val()); 
      var total = txtweeklyMailing * 25; 
      $('#txtpostcardperweek').val(total.toFixed(2)); 
     }); 
    }); 
</script> 
<p> 
    Number of weekly mailings 
    @Html.TextBoxFor(m => m.WeeklyMailings, new { id = "weeklymailing" }) 
    x 25 
</p> 
<p>=</p> 
<p> 
    @Html.TextBoxFor(m => m.PostcardsperWeek, new { id = "txtpostcardperweek", @readonly = "readonly" }) 
    Total postcards per week 
</p> 

個人而言，我傾向於第二種方法，因爲你不混合的JavaScript和標記從而降低了你的HTML頁面的大小，你可以把JavaScript放到一個單獨的靜態文件中，這個文件可以被客戶端瀏覽器緩存。