Массив Javascript и var не будут отображаться при добавлении в теги сценария. - PullRequest
0 голосов
/ 05 октября 2019

У меня большой код, с которым я работаю. Моя проблема в том, что у меня есть несколько таблиц / массивов, которые я не знаю, как группировать по одному тегу скрипта, чтобы у них всех была своя собственная. Мои таблицы работают хорошо отдельно, но я знаю, что код запутан. Я не могу понять массив. Предполагалось, что это будет массив 3х5, но когда он появится на странице, все это один столбец и одна строка. Другая проблема заключается в том, что когда я пытаюсь глобально объявить массив, сам текст отображается в html, а не выполняется должным образом.

    <!DOCTYPE html>
     <html>



    <head>

      <title>Door Crash Order Page, v2</title>
       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

      <meta http-equiv="Expires" content="-1">

      <!-- External CSS link -->
      <link rel="stylesheet" type="text/css" 
        href="DoorCrash-ExternalStyles.css">
    <script language="javascript">
    function add() {
        var FoodItems = [
            [
                document.getElementById('input5'),
                document.getElementById('input6'),
                document.getElementById('input7')
            ],

           [
                document.getElementById('input1'),
                document.getElementById('input3'),
                 document.getElementById('input10')
            ]
           ];

        var result = [];

        for (var i = 0; i < els.length; i++) {
            result[result.length] = parseInt(els[0][i].value) - 
    parseInt(els[1][i].value);
        }

        alert(result.join(' '));


      console.log("FoodItems");
    localStorage.setItem("FoodItems", JSON.stringify(FoodItems));
    }
    window.addEventListener("load", () => { 
        const ret = localStorage.getItem("FoodItems");
        if(!ret) {
            alert("retrieval successful");
        }
    });
    <script language="JavaScript"><!--
    function cent(amount) {
    // returns the amount in the .99 format
        return (amount == Math.floor(amount)) ? amount + '.00' : (  (amount*10 
    == Math.floor(amount*10)) ? amount + '0' : amount);
    }

    function update(form) {
        var subtotal = (form.quantity.value - 0) * (form.unitcost.value - 0)+ 
    (form.quantity1.value - 0) * (form.unitcost1.value - 0)+ 
   (form.quantity2.value - 0) * (form.unitcost2.value - 0)+ 
   (form.quantity3.value - 0) * (form.unitcost3.value - 0);

        subtotal = Math.floor(subtotal * 1000)/1000;
        form.subtotal.value = '$' + cent(subtotal);

        var tax = subtotal / 100 * (form.rate.value - 0);
        tax = Math.floor(tax * 1000)/1000;
        form.tax.value = '$' + cent(tax);

        total = subtotal + tax;
        total = Math.floor(total * 1000)/1000;
        form.total.value = '$' + cent(total);
    }
     //--></script>
    <h4>Jimmy John's</h4>
    <form>
    <table>
    <tr><td>The Veggie Quantity: </td><td><input type="text" name="quantity" 
    size="8"></td></tr>
    <tr><td>Billy Club Quantity: </td><td><input type="text" name="quantity1" 
    size="8"></td></tr>
    <tr><td>Totally Tuna Quantity: </td><td><input type="text" 
    name="quantity2" size="8"></td></tr>
    <tr><td>Turkey Tom Quantity: </td><td><input type="text" name="quantity3" 
    size="8"></td></tr>
    <tr><td>The Veggie Cost: </td><td><input type="text" name="unitcost" 
    value="6.99"size="8"></td></tr>
    <tr><td>Billy Club Cost: </td><td><input type="text" name="unitcost1" 
    value="8.09"size="8"></td></tr>
    <tr><td>Totally Tuna Cost: </td><td><input type="text" name="unitcost2" 
    value="9.49"size="8"></td></tr>
    <tr><td>Turkey Tom Cost: </td><td><input type="text" name="unitcost3" 
    value="7.99"size="8"></td></tr>
     <tr><td>Tax Rate (%): </td><td><input type="text" name="rate" 
    value="6"size="8"></td></tr>
    <tr><td>Subtotal: </td><td><input type="text" name="subtotal"size="8"> 
   </td></tr>
    <tr><td>Order Tax: </td><td><input type="text" name="tax"size="8"></td> 
   </tr>
    <tr><td>Order Total: </td><td><input type="text" name="total"size="8"> 
   </td></tr>
    <tr><td> </td><td><input type="button" onClick="update(this.form)" 
    value="Click Me"></td></tr>
    </table>
    </form>

    <br>
    <script language="JavaScript"><!--
    function cent(amount) {
    // returns the amount in the .99 format
    return (amount == Math.floor(amount)) ? amount + '.00' : (  (amount*10 == 
    Math.floor(amount*10)) ? amount + '0' : amount);
    }

    function update(form) {
    var subtotal = (form.quantity.value - 0) * (form.unitcost.value - 0)+ 
    (form.quantity1.value - 0) * (form.unitcost1.value - 0)+ 
   (form.quantity2.value - 0) * (form.unitcost2.value - 0)+ 
   (form.quantity3.value - 0) * (form.unitcost3.value - 0);

    subtotal = Math.floor(subtotal * 1000)/1000;
    form.subtotal.value = '$' + cent(subtotal);

    var tax = subtotal / 100 * (form.rate.value - 0);
    tax = Math.floor(tax * 1000)/1000;
    form.tax.value = '$' + cent(tax);

    total = subtotal + tax;
    total = Math.floor(total * 1000)/1000;
    form.total.value = '$' + cent(total);
    }
    //--></script>

    <h4>Red Robins</h4>
    <form>
    <table>
    <tr><td>Fish and Chips Quantity: </td><td><input type="text" 
    name="quantity" size="8"></td></tr>
    <tr><td>Clucks and Shrimp Quantity: </td><td><input type="text" 
    name="quantity1" size="8"></td></tr>
    <tr><td>Salmon Quantity: </td><td><input type="text" name="quantity2" 
    size="8"></td></tr>
    <tr><td>Cheeseburger Quantity: </td><td><input type="text" 
    name="quantity3" size="8"></td></tr>
    <tr><td>Fish and Chips Cost: </td><td><input type="text" name="unitcost" 
    value="9.99"size="8"></td></tr>
    <tr><td>Clucks and Shrimp Cost: </td><td><input type="text" 
    name="unitcost1" value="13.29"size="8"></td></tr>
    <tr><td>Salmon Cost: </td><td><input type="text" name="unitcost2" 
    value="12.79"size="8"></td></tr>
    <tr><td>Cheeseburger Cost: </td><td><input type="text" name="unitcost3" 
    value="8.19"size="8"></td></tr>
    <tr><td>Tax Rate (%): </td><td><input type="text" name="rate" 
    value="6"size="8"></td></tr>
    <tr><td>Subtotal: </td><td><input type="text" name="subtotal"size="8"> 
    </td></tr>
    <tr><td>Order Tax: </td><td><input type="text" name="tax"size="8"></td> 
    </tr>
    <tr><td>Order Total: </td><td><input type="text" name="total"size="8"> 
    </td></tr>
    <tr><td> </td><td><input type="button" onClick="update(this.form)" 
    value="Click Me"></td></tr>
    </table>
    </form>
    <br>
    <script language="JavaScript"><!--
     function cent(amount) {
    // returns the amount in the .99 format
    return (amount == Math.floor(amount)) ? amount + '.00' : (  (amount*10 == 
    Math.floor(amount*10)) ? amount + '0' : amount);
    }

    function update(form) {
    var subtotal = (form.quantity.value - 0) * (form.unitcost.value - 0)+ 
    (form.quantity1.value - 0) * (form.unitcost1.value - 0)+ 
    (form.quantity2.value - 0) * (form.unitcost2.value - 0)+ 
    (form.quantity3.value - 0) * (form.unitcost3.value - 0);

    subtotal = Math.floor(subtotal * 1000)/1000;
    form.subtotal.value = '$' + cent(subtotal);

    var tax = subtotal / 100 * (form.rate.value - 0);
    tax = Math.floor(tax * 1000)/1000;
    form.tax.value = '$' + cent(tax);

    total = subtotal + tax;
    total = Math.floor(total * 1000)/1000;
    form.total.value = '$' + cent(total);
    }
    //--></script>
    <h4>Bob Evans </h4>
     <form>
    <table>
    <tr><td>Homestead Breakfast Quantity: </td><td><input type="text" 
    name="quantity" size="8"></td></tr>
    <tr><td>Fruitiful Farmer Quantity: </td><td><input type="text" 
    name="quantity1" size="8"></td></tr>
    <tr><td>Chicken Tenders Quantity: </td><td><input type="text" 
    name="quantity2" size="8"></td></tr>
    <tr><td>Meatloaf Quantity: </td><td><input type="text" name="quantity3" 
    size="8"></td></tr>
    <tr><td>Homestead Breakfast Cost: </td><td><input type="text" 
    name="unitcost" value="7.99"size="8"></td></tr>
    <tr><td>Fruitiful Farmer Cost: </td><td><input type="text" 
    name="unitcost1" value="8.99"size="8"></td></tr>
    <tr><td>Chicken Tenders Cost: </td><td><input type="text" name="unitcost2" 
    value="11.49"size="8"></td></tr>
    <tr><td>Meatloaf Cost: </td><td><input type="text" name="unitcost3" 
    value="12.99"size="8"></td></tr>
    <tr><td>Tax Rate (%): </td><td><input type="text" name="rate" 
    value="6"size="8"></td></tr>
    <tr><td>Subtotal: </td><td><input type="text" name="subtotal"size="8"> 
   </td></tr>
    <tr><td>Order Tax: </td><td><input type="text" name="tax"size="8"></td> 
   </tr>
    <tr><td>Order Total: </td><td><input type="text" name="total"size="8"> 
   </td></tr>
   <tr><td> </td><td><input type="button" onClick="update(this.form)" 
    value="Click Me"></td></tr>
    </table>
    </form>
    <br>
    <script language="JavaScript"><!--
    function cent(amount) {
    // returns the amount in the .99 format
    return (amount == Math.floor(amount)) ? amount + '.00' : (  (amount*10 == 
    Math.floor(amount*10)) ? amount + '0' : amount);
    }

    function update(form) {
    var subtotal = (form.quantity.value - 0) * (form.unitcost.value - 0)+ 
    (form.quantity1.value - 0) * (form.unitcost1.value - 0)+ 
   (form.quantity2.value - 0) * (form.unitcost2.value - 0)+ 
   (form.quantity3.value - 0) * (form.unitcost3.value - 0);

    subtotal = Math.floor(subtotal * 1000)/1000;
    form.subtotal.value = '$' + cent(subtotal);

    var tax = subtotal / 100 * (form.rate.value - 0);
    tax = Math.floor(tax * 1000)/1000;
    form.tax.value = '$' + cent(tax);

    total = subtotal + tax;
    total = Math.floor(total * 1000)/1000;
    form.total.value = '$' + cent(total);
    }
    //--></script>
    <h4>The Brown Jug</h4>
    <form>
    <table>
    <tr><td>Italian Club Quantity: </td><td><input type="text" name="quantity" 
    size="8"></td></tr>
    <tr><td>Tuna Salad Sandwhich Quantity: </td><td><input type="text" 
    name="quantity1" size="8"></td></tr>
    <tr><td>Parmigiana Sandwhich Quantity: </td><td><input type="text" 
    name="quantity2" size="8"></td></tr>
    <tr><td>Potato Skins Quantity: </td><td><input type="text" 
    name="quantity3" size="8"></td></tr>
    <tr><td>Italian Club Cost: </td><td><input type="text" name="unitcost" 
    value="9.99"size="8"></td></tr>
    <tr><td>Tuna Salad Sanwhich Cost: </td><td><input type="text" 
    name="unitcost1" value="7.99"size="8"></td></tr>
    <tr><td>Parmigiana Sandwhich Cost: </td><td><input type="text" 
    name="unitcost2" value="8.99"size="8"></td></tr>
    <tr><td>Potato Skins Cost: </td><td><input type="text" name="unitcost3" 
    value="8.50"size="8"></td></tr>
    <tr><td>Tax Rate (%): </td><td><input type="text" name="rate" 
    value="6"size="8"></td></tr>
    <tr><td>Subtotal: </td><td><input type="text" name="subtotal"size="8"> 
    </td></tr>
    <tr><td>Order Tax: </td><td><input type="text" name="tax"size="8"></td> 
    </tr>
    <tr><td>Order Total: </td><td><input type="text" name="total"size="8"> 
    </td></tr>
    <tr><td> </td><td><input type="button" onClick="update(this.form)" 
    value="Click Me"></td></tr>
    </table>
    </form>


    </head>

    <body>



     extern double a[3][5];   
         // Array declaration 
    function add() {
     var FoodItems = [
         [
            document.getElementById('input5'),
            document.getElementById('input6'),
            document.getElementById('input7')
        ],
        [
            document.getElementById('input1'),
            document.getElementById('input3'),
              document.getElementById('input10')
        ]
      ];

      var result = [];

    for (var i = 0; i < els.length; i++) {
        result[result.length] = parseInt(els[0][i].value) - parseInt(els[1] 
   [i].value);
     }

    alert(result.join(' '));
    }
    <input text="text" value="Resturant Name" id="input5"/>
    <input text="text" value="Item Name" id="input6"/>
    <input text="text" value="Item price" id="input7"/>
    <br>
    <input text wrap ="text" value="Jimmy John's" id="input1"/>
    <input text wrap="text" value="Billy Club, Turkey Tom, Totally Tuna, The 
    Veggie" id="input2"/>
    <input text="text" value="$8.09, $7.99, $9.49, $6.99 " id="input8"/>
    <br>
    <input text="text" value="Red Robins" id="input3"/>
    <input text="text" value="Fish and Chips, Clucks and Shrimp, Salmon, 
    Cheeseburger" id="input4"/>
    <input text="text" value="$9.99, $13.29, $12.79, $8.19" id="input9"/>
    <br>
    <input text="text" value="Bob Evans" id="input10"/>
    <input text="text" value="Homestead Breakfast, Fruitiful Farmer, Chicken 
    Tenders, Meatloaf" id="input11"/>
    <input text="text" value="$7.99, $8.99, $11.49, $12.99" id="input12"/>
   <br>
   <input text="text" value="The Brown Jug" id="input13"/>
   <input text="text" value="Italian Club, Tuna Salad, Parm Sandwhich, Potato 
    Skin" id="input14"/>
   <input text="text" value="$9.99, $7.99, $8.99, $8.50" id="input15"/>
      console.log("FoodItems");
      localStorage.setItem("FoodItems", JSON.stringify(FoodItems));

      <!-- Header -->
  Door Crash Order Page
  <hr>

  <!-- Menu -->
  <div class="menu">
    <a href="DoorCrash-Main.html">Main Page</a>
    <a href="DoorCrash-Restaurants.html">Restaurants Page</a>
    <a href="DoorCrash-Order.html">Order Page</a>
   </div>
   <hr>

   <!-- Form -->
   <form 
    method="get" 
    enctype="application/x-www-form-urlencoded"
    action="http://www.tipjar.com/cgi-bin/test" 
    >

    <label>Name: </label>
    <input type="text" name="txtName" required>
    <br><br>

    <label>Address: </label>
    <input type="text" name="txtAddress" required>
    <br><br>

    <label>Phone: </label>
    <input type="tel" name="inpPhone" required>
    <br><br>
    <fieldset class="fieldsetStyle">
      <legend>Restaurant:</legend>
      <input type="radio" name="rbRestaurant" value="BobEvans" 
    class="radioButtonStyle"> Bob Evans<br>
      <input type="radio" name="rbRestaurant" value="BrownJug" 
    class="radioButtonStyle"> Brown Jug<br>
      <input type="radio" name="rbRestaurant" value="JimmyJohns" 
    class="radioButtonStyle"> Jimmy Johns<br>
      <input type="radio" name="rbRestaurant" value="RedRobin" 
    class="radioButtonStyle"> Red Robin<br>
    </fieldset>
    <br>



  <!-- Footer -->
  <hr>

     Door Crash, 1204 South University Avenue, Ann Arbor, MI 48104, MI
      &nbsp;&nbsp;734-761-3355&nbsp;&nbsp;Copyright &#169; 2019

  <hr>

    </body>

    </html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...