1. 首頁
  2. 問答
  3. 如何在HTML的Web應用程序計算速度

如何在HTML的Web應用程序計算速度

2017-08-03 162 views
1

如何使用HTML的Web應用中的一些公式如何在HTML的Web應用程序計算速度

我已經在這個形式我試圖提供一個選項，生成的速度創建的HTML Web應用程序在谷歌的腳本來計算速度服務（更像計算器 - 使用乘法函數）

當用戶在「小時數」選項卡中輸入時間時，附加了html腳本（C）函數應該運行並且它應該與「每小時率」反映在「D」（總費率）

此外，它應該反映在總計標籤總費用

個 

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <title>Bootstrap Example</title> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</head> 
 
<body> 
 
<nav class="navbar navbar-inverse"> 
 
    <div class="container-fluid"> 
 
    <div class="navbar-header"> 
 
     <img src="" alt="IIFL LOGO" style="width:100px;height:50px;"> 
 
    </div> 
 
    <ul class="nav navbar-nav"> 
 
     <li class="active"><a href="">Home</a></li> 
 
     <p class="navbar-text"></p> 
 
     <p class="navbar-text"> </p> 
 
     <li class="active"><a >Technology Team-Project Proposal Form</a></li> 
 
    
 
     <p class="navbar-text">  </p> 
 
     <p class="navbar-text">  </p> 
 
     <p class="navbar-text">  </p> 
 

 
    </ul> 
 
    
 
    <form class="navbar-form navbar-left" onsubmit="return searchRequest();"> 
 
     <div class="form-group"> 
 
     <input type="text" id="requestID" class="form-control" placeholder="Search Requset Number"> 
 
     <button type="submit" class="btn btn-primary">Search</button> 
 
     <button type="button" onclick="updateRequest()" id="updateBtn" class="btn btn-success">Save</button> 
 
     <a href="https://script.google.com/a/macros/iifl.com/s/AKfycbyR7BzkYpbt2EKkIdoViJO1ZshPCXs9TBPv4P2eJGs/dev" class="btn btn-danger" role="button">Refresh</a> 
 
     </div> 
 
    </form> 
 
    </div> 
 
</nav> 
 
<div class="container-fluid"> 
 
<div class="row"> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Project Name</label><input type="text" class="form-control" id="requestNumber"></div> 
 
</div> 
 
<hr style="height:2px;border-width:0;color:gray;background-color:gray"> 
 
    <div class="row"> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Service Area</label><input type="text" class="form-control" id="Service Area"type="text" placeholder="Manager" disabled></div> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Per Hour Rate</label><input type="text" class="form-control" id="Per Hour Rate"type="text" placeholder="500" disabled></div> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Number Of Hours</label><input type="text" class="form-control" id="rTpe"></div> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Total Rate</label><input type="text" class="form-control" id="rFor"></div> 
 
</div> 
 
<div class="row"> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Service Area</label><input type="text" class="form-control" id="Service Area"type="text" placeholder="Project Manager" disabled></div> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Per Hour Rate</label><input type="text" class="form-control" id="Per Hour Rate"type="text" placeholder="300" disabled></div> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Number Of Hours</label><input type="text" class="form-control" id="rTpe"></div> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Total Rate</label><input type="text" class="form-control" id="rFor"></div> 
 
</div> 
 
<hr style="height:2px;border-width:0;color:gray;background-color:gray"> 
 
<div class="row"> 
 
<div class="col-xs-3"><label for="usr"><p class="text-primary">Grand Total Rate</label><input type="text" class="form-control" id="rFor"></div> 
 
</div> 
 
<div class="container"> 
 
    <button type="button" class="btn btn-success active" onclick="updateRequest()" id="updateBtn" class="center">Save</button>  
 
</div> 
 
</div> 
 
</body> 
 
</html>

來源

2017-08-03 KiKu

回答

0

請參閱下面的代碼...

 
 
    $("#rTpe1").keyup(function(e){ 
 
     $("#rFor1").val(this.value * $("#PerHourRate1").val()); 
 
     $("#rFor3").val(Number($("#rFor1").val()) + Number($("#rFor2").val())) 
 
    }); 
 
    
 
    $("#rTpe2").keyup(function(e){ 
 
     $("#rFor2").val(this.value * $("#PerHourRate2").val()); 
 
     $("#rFor3").val(Number($("#rFor1").val()) + Number($("#rFor2").val())) 
 
    }); 
 
    
 

 
    
 

<!DOCTYPE html> 
 
    <html lang="en"> 
 
    <head> 
 
     <title>Bootstrap Example</title> 
 
     <meta charset="utf-8"> 
 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
    </head> 
 
    <body> 
 
    <nav class="navbar navbar-inverse"> 
 
     <div class="container-fluid"> 
 
     <div class="navbar-header"> 
 
      <img src="" alt="IIFL LOGO" style="width:100px;height:50px;"> 
 
     </div> 
 
     <ul class="nav navbar-nav"> 
 
      <li class="active"><a href="">Home</a></li> 
 
      <p class="navbar-text"></p> 
 
      <p class="navbar-text"> </p> 
 
      <li class="active"><a >Technology Team-Project Proposal Form</a></li> 
 
     
 
      <p class="navbar-text">  </p> 
 
      <p class="navbar-text">  </p> 
 
      <p class="navbar-text">  </p> 
 
    
 
     </ul> 
 
     
 
     <form class="navbar-form navbar-left" onsubmit="return searchRequest();"> 
 
      <div class="form-group"> 
 
      <input type="text" id="requestID" class="form-control" placeholder="Search Requset Number"> 
 
      <button type="submit" class="btn btn-primary">Search</button> 
 
      <button type="button" onclick="updateRequest()" id="updateBtn" class="btn btn-success">Save</button> 
 
      <a href="https://script.google.com/a/macros/iifl.com/s/AKfycbyR7BzkYpbt2EKkIdoViJO1ZshPCXs9TBPv4P2eJGs/dev" class="btn btn-danger" role="button">Refresh</a> 
 
      </div> 
 
     </form> 
 
     </div> 
 
    </nav> 
 
    <div class="container-fluid"> 
 
    <div class="row"> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Project Name</label><input type="text" class="form-control" id="requestNumber"></div> 
 
    </div> 
 
    <hr style="height:2px;border-width:0;color:gray;background-color:gray"> 
 
     <div class="row"> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Service Area</label><input type="text" class="form-control" id="Service Area"type="text" placeholder="Manager" disabled></div> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Per Hour Rate</label><input type="text" class="form-control" id="PerHourRate1"type="text" value="500" readonly></div> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Number Of Hours</label><input type="text" class="form-control" id="rTpe1"></div> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Total Rate</label><input type="text" class="form-control" id="rFor1"></div> 
 
    </div> 
 
    <div class="row"> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Service Area</label><input type="text" class="form-control" id="Service Area"type="text" placeholder="Project Manager" disabled></div> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Per Hour Rate</label><input type="text" class="form-control" id="PerHourRate2"type="text" value="300" readonly></div> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Number Of Hours</label><input type="text" class="form-control" id="rTpe2"></div> 
 
     <div class="col-xs-3"><label for="usr"><p class="text-primary">Total Rate</label><input type="text" class="form-control" id="rFor2"></div> 
 
    </div> 
 
    <hr style="height:2px;border-width:0;color:gray;background-color:gray"> 
 
    <div class="row"> 
 
    <div class="col-xs-3"><label for="usr"><p class="text-primary">Grand Total Rate</label><input type="text" class="form-control" id="rFor3" readonly></div> 
 
    </div> 
 
    <div class="container"> 
 
     <button type="button" class="btn btn-success active" onclick="updateRequest()" id="updateBtn" class="center">Save</button>  
 
    </div> 
 
    </div> 
 
    
 
     </body> 
 
    </html>

來源

2017-08-03 18:50:17 Ritz

+0

謝謝里茲 幫我把下面的按鈕排列在左側

– KiKu

+1

謝謝， Riz for Script ...： ） 我已修復HTML對齊問題...請忽略以上評論 – KiKu

+0

如何以印度盧比格式獲取此數字 – KiKu

相關問題

 相關問題