简单的JavaScript租赁计算

时间:2018-03-03 03:23:40

标签: javascript html

Hello Stack Overflowers。我的HTML课程中有一个正在进行的作业。我目前已经为它创建了4个简单的介绍页面,但目前仍然坚持这个非常简单的JavaScript计算。但我觉得我很亲近。请原谅我凌乱的代码。我无论如何都是a" noob"在JS,但我正在努力。任何帮助表示赞赏。

我的提示是: "创建一个页面,允许从短列表中选择设备,然后允许选择租赁开始日期和结束日期,然后计算两个选定日期之间的天数。最后,将单位租金成本乘以天数,并为总成本增加8%的税。"

我的代码:



<html>
<head>
<title> Rental Program </title>

<script language="javascript">

//listbox.htm

function processit() {
string1=document.myform.numb1.value;

numb2=document.myform.alist.selectedIndex;

perweek=0;

if (string1 == 'Books') { perweek=300; }
if (string1 == 'Calculator') { perweek=200; }
if (string1 == 'Computer') { perweek=100; }
if (string1 == 'Camera') { perweek= 50; }

}
</script>

</head>

<body

<form name=myform>
<h4>Enter the item you wish to rent using the list below:
<input size =12 type="text" name="numb1">
</h4>
<li> Books = $300 per week
<li> Calculator = $200 per week
<li> Computer = $100 per week
<li> Camera = $50 per week

<h4> Select how many weeks you wish to rent: </h4>


<p>

</form>

</body>
<html>
<head>
<script type="text/javascript">
  
function GetDays(){
var dropdt = new Date(document.getElementById("drop_date").value);
var pickdt = new Date(document.getElementById("pick_date").value);
return parseInt((dropdt - pickdt) / (24 * 3600 * 1000));
}

function cal(){
if(document.getElementById("drop_date")){
document.getElementById("numdays2").value=GetDays();
}  
function GetTotal(){
var total = ($('[numb1]').val()(*0.8*total));

}

</script>
</head>
<body>
  
<div id="reserve_form">

<div id="pickup_date"><p><label class="form">Pickup Date:</label><input type="date" class="textbox" id="pick_date" name="pickup_date" onchange="cal()"</p></div>

<div id="dropoff_date"><p><label class="form">Dropoff Date:</label><input type="date" class="textbox" id="drop_date" name="dropoff_date" onchange="cal()"/></p></div>

<div id="numdays"><label class="form">Number of days:</label><input type="text" class="textbox" id="numdays2" name="numdays"/></div>
<h5>Total Amount in $ </h5>
<input size =12 type="text" name="total">
<p>
</div>
</body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

第70行出错。您也忘了终止if语句

if(document.getElementById("drop_date")){

工作代码:

&#13;
&#13;
<html>
  <head>
    <title> Rental Program </title>

	<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
    <script language="javascript">

      //listbox.htm

      function processit() {
        string1=document.getElementById("numb1").value;

        //numb2=document.myform.alist.selectedIndex;

        perweek=0;

        if (string1 == 'Books') { perweek=300; }
        if (string1 == 'Calculator') { perweek=200; }
        if (string1 == 'Computer') { perweek=100; }
        if (string1 == 'Camera') { perweek= 50; }
return perweek
      }
    </script>

  </head>

  <body

<form name=myform>
  <h4>Enter the price of the item you wish to rent using the list below:
    <input size =12 type="text" name="numb1" id="numb1">
  </h4>
  <li> Books = $300 per week
  <li> Calculator = $200 per week
  <li> Computer = $100 per week
  <li> Camera = $50 per week

    <h4> Select how many weeks you wish to rent: </h4>


    <p>

  </form>

  </body>
<html>
  <head>
    <script type="text/javascript">
var items = {
"Book":"300"
}
      function GetDays(){
        var dropdt = new Date(document.getElementById("drop_date").value);
        var pickdt = new Date(document.getElementById("pick_date").value);
        return parseInt((dropdt - pickdt) / (24 * 3600 * 1000));
      }

      function cal(){
        if(document.getElementById("drop_date")){
        var result = GetDays()
        if(isNaN(result)){result="Please fill out both dates"}
          document.getElementById("numdays2").value=result;
          }
        }  
        function GetTotal(){
        var price = processit(document.getElementById("numb1").value)
        var duration = document.getElementById("numdays2").value
          var total = Math.floor((price*(0.8*(duration)))*100)/100;
          if(isNaN(total)){total="Please fill out both dates"}
document.getElementById("total").value = total
        }

    </script>
  </head>
  <body>

    <div id="reserve_form">

      <div id="pickup_date"><p><label class="form">Pickup Date:</label><input type="date" class="textbox" id="pick_date" name="pickup_date" onchange="cal();GetTotal()"/></p></div>

      <div id="dropoff_date"><p><label class="form">Dropoff Date:</label><input type="date" class="textbox" id="drop_date" name="dropoff_date" onchange="cal();GetTotal()"/></p></div>

      <div id="numdays"><label class="form">Number of days:</label><input type="text" class="textbox" id="numdays2" name="numdays" disabled/></div>
      <h5>Total Amount in $ </h5>
      <input size =12 type="text" name="total" id="total" disabled>
      <p>
    </div>
  </body>
</html>
&#13;
&#13;
&#13;