如何使用javascript在EDIT视图模型中进行计算？和html.editorfor输入

Question

我一直在努力解决这个问题。现在，我对JavaScript不是很熟悉，但是我已经在互联网上尝试了许多想法和解决方案，但仍然无法让JavaScript为我工作这就是我想要做的事情：

我想在多个Html.EditorFor中使用这些值，然后使用它们进行计算，然后将这些计算实时放在同一视图中的其他Html.EditorFor中。我也想从一些HTML.EditorFor中获取值，并在视图中的其他位置再次显示它们。以下是我的Viewmodel的一部分。

视图模型＃

 @model BSIntranet.ViewModels.JobRecapViewModel
    <link href="~/Content/EditPageStyle.css" rel="stylesheet" />

    @using (Html.BeginForm())
    {
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
    <h4>JobRecap</h4>

    <div class="col-md-12">
    @Html.ValidationSummary(true, "", new {@class = "text-danger"})

    <div id="pad" class="form-group">
        @Html.LabelFor(model => model.ANumber1, "Job_ID", htmlAttributes: new     {@class = "control-label col-md-3"})
        <div class="col-md-4">
            @Html.EditorFor(model => model.ANumber1, new {htmlAttributes = new {@class = "form-control", id = "Num1"}})
            @Html.ValidationMessageFor(model => model.ANumber1, "", new {@class = "text-danger"})
        </div>

        @Html.LabelFor(model => model.ANumber2, htmlAttributes: new {@class = "control-label col-md-3"})
        <div class="col-md-offset-8">
            @Html.EditorFor(model => model.ANumber2, new {htmlAttributes = new {@class = "form-control, id = "Num2"}})
            @Html.ValidationMessageFor(model => model.ANumber2, "", new {@class = "text-danger"})
        </div>
    </div>

    <div id="pad" class="form-group">
        @Html.LabelFor(model => model.Total, htmlAttributes: new {@class = "control-label col-md-3"})
        <div class="col-md-4">
            @Html.EditorFor(model => model.Total, new {htmlAttributes = new {@class = "form-control", id = "Total"}})
            @Html.ValidationMessageFor(model => model.Total, "", new {@class = "text-danger"})
        </div>
    //Want to display this total again in view in another section and 
    // this changes when num1 and num2 are changed in real-time
     <div id = "totalagain"> </div>

    div>
    @Html.ActionLink("Back to List", "Index")
    </div>

    @section Scripts {
    @Scripts.Render("~/bundles/jqueryval")


    }

控制器

 // GET: JobRecaps/Edit/5
    public ActionResult Edit(int? id)
    {
        if (id == null)
        {
            return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
        }
        JobRecap jobRecap = _db.JobRecaps.Find(id);
        if (jobRecap == null)
        {
            return HttpNotFound();
        }


        var viewModel = Mapper.Map<JobRecapViewModel>(jobRecap);

        var projectedSavingsAndLossCollection = _db.GetProjectedJobStatus(jobRecap.Date, jobRecap.Job_ID).ToList();
        _savingsOrLossMapper.Map(viewModel, projectedSavingsAndLossCollection);

        viewModel.PerformCalculation();


        return View(viewModel);
    }

    // POST: JobRecaps/Edit/5

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Edit(JobRecapViewModel viewModel)
    {
        if (ModelState.IsValid)
        {
            var jobRecap =_db.JobRecaps.Find(viewModel.ID);
            _jobRecapViewModelMapper.Map(jobRecap, viewModel);

            _db.SaveChanges();
            return RedirectToAction("Index");
        }


        return View(viewModel);
    }

我尝试了什么

<script>
$("#Num2").keyup(function(){
   total = $("#Num2").val()* $("#Num1").val();
$("#Total").val(total);
}); 

$(document).ready(function () {
$("#Total").on('input',function(){
   $('#totalagain').val($(this).val());
});
});
</script>

我已经阅读了各种方法来做到这一点，但还没有任何工作。无论我做什么，Javascript都无法正常工作。我没有结果，我很沮丧。我是那种必须看到代码，分解代码并将它们重新组合起来学习的人，我非常希望有人帮助我解决这个问题。我已经看过各种各样的文章，教程等关于ajax，淘汰赛等等，但我无法弄明白。我需要的只是一个有效的例子，我将能够完成这个视图（恰好有大约20个计算完成）。 在此先感谢，请不要打败我！ ：）