當設置表單值時，JQuery val（）拋出運行時錯誤

Question

我是Javascript/JQuery的新手，所以如果我缺少一些簡單的東西，請致歉。我試圖製作一個按鈕來計算單位價格的數量總計，然後填充總計字段的結果。這是在ASP.NET MVC3中使用VS2010完成的。

我的代碼似乎拉取了SpoilageQuantity和SpoilageUnitPrice的值OK，但是無法設置SpoilageTotalPrice的值。該錯誤說，我試圖給函數結果賦值，但我的理解是val（）可以用來獲取和設置表單字段值。更正或建議？

VS2010視圖：

<div class="editor-label"> 
    @Html.LabelFor(model => model.SpoilageQuantity) 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.SpoilageQuantity) 
    @Html.ValidationMessageFor(model => model.SpoilageQuantity) 
</div> 

<div class="editor-label"> 
    @Html.LabelFor(model => model.SpoilageUnitPrice) 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.SpoilageUnitPrice) 
    @Html.ValidationMessageFor(model => model.SpoilageUnitPrice) 
</div> 

<div class="editor-label"> 
    @Html.LabelFor(model => model.SpoilageTotalPrice) 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.SpoilageTotalPrice) 
    @Html.ValidationMessageFor(model => model.SpoilageTotalPrice) 
    <input type="button" value="Calculate" onclick="calculateTotal()" /> 
</div> 

JS文件：

function calculateTotal() { 
// calculate total spoilage price from unit price and quantity 
var totalprice = $('#SpoilageQuantity').val() * $('#SpoilageUnitPrice').val(); 
totalprice = totalprice.toFixed(2); 

$('#SpoilageTotalPrice').val(totalprice); 
} 

渲染HTML：

<div class="editor-label"> 
     <label for="SpoilageQuantity">Item Quantity</label> 
    </div> 
    <div class="editor-field"> 
     <input class="text-box single-line" data-val="true" data-val-number="The field Item Quantity must be a number." data-val-required="Quantity of item lost is required." id="SpoilageQuantity" name="SpoilageQuantity" type="text" value="0.00" /> 
     <span class="field-validation-valid" data-valmsg-for="SpoilageQuantity" data-valmsg-replace="true"></span> 
    </div> 

    <div class="editor-label"> 
     <label for="SpoilageUnitPrice">Unit Price</label> 
    </div> 
    <div class="editor-field"> 
     <input class="text-box single-line" data-val="true" data-val-number="The field Unit Price must be a number." data-val-required="Unit price is required." id="SpoilageUnitPrice" name="SpoilageUnitPrice" type="text" value="0.00" /> 
     <span class="field-validation-valid" data-valmsg-for="SpoilageUnitPrice" data-valmsg-replace="true"></span> 
    </div> 

    <div class="editor-label"> 
     <label for="SpoilageTotalPrice">Total Price</label> 
    </div> 
    <div class="editor-field"> 
     <input class="text-box single-line" data-val="true" data-val-number="The field Total Price must be a number." data-val-required="The Total Price field is required." id="SpoilageTotalPrice" name="SpoilageTotalPrice" type="text" value="0.00" /> 
     <span class="field-validation-valid" data-valmsg-for="SpoilageTotalPrice" data-valmsg-replace="true"></span> 
     <input type="button" value="Calculate" onclick="calculateTotal()" /> 
    </div> 

錯誤消息：

Microsoft JScript runtime error: Cannot assign to a function result 

編輯：整個js文件：

/* Copyright 2012 Tom Barrett 

This file is part of PFC Logs. 

PFC Logs is free software: you can redistribute it and/or modify 
it under the terms of the GNU General Public License as published by 
the Free Software Foundation, either version 3 of the License, or 
(at your option) any later version. 

PFC Logs is distributed in the hope that it will be useful, 
but WITHOUT ANY WARRANTY; without even the implied warranty of 
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 
GNU General Public License for more details. 

You should have received a copy of the GNU General Public License 
along with PFC Logs. If not, see <http://www.gnu.org/licenses/>. 
*/ 

function autoFocus() { 
    // Auto-focus on the first text field upon page load. 
    $("input[type=text]").first().focus(); 
} 

function calculateTotal() { 
    // calculate total from quantity & unit price 
    var totalprice = $('#SpoilageQuantity').val() * $('#SpoilageUnitPrice').val(); 
    totalprice = totalprice.toFixed(2); 
    $("#SpoilageTotalPrice").val(totalprice); 
} 

Answer 1

我不知道的技術性......但我也遇到過這個。如果我的函數是在一個單獨的js文件中，我鏈接到我的標籤jquery（或Jscript爲此）無法找到元素。如果我在標籤中包含腳本，那麼一切正常。