Question

我刚接触Javascript和Jquery Coding，我在Jquery Mbile下创建了一个表单，我希望将两个输入值相乘，并点击＆＃34;计算＆＃34;按钮我想在Jquery Forms中的第三个框中显示结果。我尝试了很多，但无法弄清问题是什么。以下是我的HTML和Javascript文件，请帮我解决这个问题，谢谢

<!DOCTYPE html>

<html>

  <head>
    <title>Nitro Motorbike</title>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    <script src="Calculation.js"></script>


    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
  </head>

  <body>
    <div data-role="page" data-title="Nitro Motorbike">
      <!-- Header-->
      <div data-role="header">
        <h1>Nitro Motorbike Total Cost Calculation Screen</h1>

        <input type="button" value="Home" id="btnAdd" data-inline="true" data-icon="home" data-iconpos="right" onclick="window.location.href='file:///F:/programming%20business%20apps/Assignment/Nitro%20Motorbikemain%20page%20JQuery.html'">
      </div>

      <!-- Main-->
      <div data-role="main" class="ui-content">



      </div>

      <form name="totalCostForm">
        <div class="ui-field-contain">
          <label for="txttotalProduction">Total Production (Please Enter Total Number of Bikes Produced) </label><br>
          <input type="text" name="txttotalProduction" id="txttotalProduction"> <br>
          <label for="txtcostPerBike"> Cost Per Bike</label><br>
          <input type="text" name="txtcostPerBike" id="txtcostPerBike"><br>
          <label for="txtcalculateTotalCost">Total Cost</label><br>
          <input type="text" name="txtcalculateTotalCost" id="txtcalculateTotalCost" Disabled><br>

        </div>
        <input type="button" value="Calculate" id="btnAdd" data-inline="true" data-icon="check" data-iconpos="right" onclick="process()">      <br> <br>
        <input type="button" value="Click here to Proceed" id="btnAdd" data-inline="true" data-icon="carat-r" data-iconpos="right"
          onclick="window.location.href='file:///F:/programming%20business%20apps/Assignment/SydneystoreJquery.html'">
      </form>
    </div>

    <!-- Footer -->
    <div data-role="footer">
      <h4>Copyright Nitro Motorbike</h4>
    </div>
    </div>

  </body>
</html>

（Javascript功能）

function process()
{

if (!ValidateMyForm()) return;

var totalProduction= document.getElementById('txttotalProduction').value;
    var costPerBike = document.getElementById('txtcostPerBike').value;


    var calculateTotalCost = (totalProduction)*(costPerBike);

document.getElementById('txtcalculateTotalCost').value= calculateTotalCost;
}

Answer 1

我创建了一个Plunker，当我删除ValidateMyForm电话时，该工作正常（因为您没有包含它）。我说你的问题在于：

if (!ValidateMyForm()) return;

将两个输入值相乘并在Jquery Mobile表单的第三个框中显示结果

1 个答案: