创建预先安装在可以更改的框中的文本

时间:2013-07-25 01:26:20

标签: html

我在html页面中创建了很多框,但是我希望框内部已经可以更改文本。基本上我的意思是我已经拥有的盒子是空白的,当我在盒子中输入他们的值改变的文本,但我想要的是盒子里面有可以改变的原始文本值,这里是我所拥有的到目前为止...感谢帮助人员,

<html>
<head>
        <title>
            COMSC-100-5066 Assign.10 by Harrash Naemi  | 12164128
        </title>


    <script>
        function getInputAsText(_id){return document.getElementById(_id).value}
        function getInputAsNumber(_id){return parseFloat(document.getElementById(_id).value)}
        function setOutput(_id, _value){document.getElementById(_id).value = _value}

        function calculate()
        {
         // declare all variables
         var OriginalServings
         var Sause
         var Beef
         var Lemon
         var Onion
         var Tomatoe
         var Shells
         var WantedServings

         // get input values
         OriginalServings = getInputAsNumber("OriginalServingsBox")
         Sause = getInputAsNumber("SauseBox")
         Beef = getInputAsNumber("BeefBox")
         Lemon = getInputAsNumber("LemonBox")
         Onion = getInputAsNumber("OnionBox")
         Tomatoe = getInputAsNumber("TomatoeBox")
         Shells = getInputAsNumber("ShellsBox")
         WantedServings = getInputAsNumber("WantedServingsBox")


         // perform conversions
         Sause = Sause / OriginalServings * WantedServings
         Beef = Beef / OriginalServings * WantedServings
         Lemon = Lemon / OriginalServings * WantedServings
         Onion = Onion / OriginalServings * WantedServings
         Tomatoe = Tomatoe / OriginalServings * WantedServings
         Shells = Shells / OriginalServings * WantedServings

         // write output value
         setOutput ("OriginalServingsBox", WantedServings)
         setOutput ("SauseBox", Sause)
         setOutput ("BeefBox", Beef)
         setOutput ("LemonBox", Lemon)
         setOutput ("OnionBox", Onion)
         setOutput ("TomatoeBox", Tomatoe)
         setOutput ("ShellsBox", Shells)
        }
    </script>

</head>

<body>
    Instructions:<br>
    Here is a recipe for tasty pasta<br>
    <br>
    To change the recipe for a different number of servings<br>
    Type the amount of each ingredient.<br>
    Type the number of servings that you want to make.
    click the go button.<br>
    Converted amounts will appear where the original amounts were typed.<br>
    <br>
    <br>
    Input values And Output Values:<br>
    For this many servings: <input id="OriginalServingsBox"><br>

    Pasta Sause, in fluid ounces: <input id="SauseBox"><br>

    Precooked Ground beef, in ounces: <input id="BeefBox"><br>

    Freshly squeezed lemons, in quantity: <input id="LemonBox"><br>

    Onions, in quantity: <input id="OnionBox"><br>

    Tomatoes, in quantity: <input id="TomatoeBox"><br>

    Pasta Shells in ounces <input id="ShellsBox"><br>

    I want to make this many servings: <input id="WantedServingsBox"><br>
    <input type="submit" value="go" onclick="calculate()"><br>

</body>
</html>

2 个答案:

答案 0 :(得分:1)

您需要执行以下操作:

< input type="text" id="OriginalServingsBox" value="12 oz." >< br/ >

答案 1 :(得分:0)

您可以使用value属性进行输入

<input id="SomeBox" value="yourValue" />

在您的情况下,我认为,您还必须向html添加一个事件

<body onload="calculate();">

到目前为止,您的输入已填满,我认为,您需要在加载页面时计算它们