如何在表单加载时在文本框中设置值?

时间:2018-10-25 00:48:58

标签: javascript html

这是我尝试设置文本框值的方法,但似乎不起作用。我希望文本框在页面加载时在其中包含值。该功能在script标签内。

function setMSRP()
        {
            var MSRP = "$29,120.00";
            var destinationCharge = "$875.00";
            var rebate = "-$10,000.00";
            var taxes = "6%"
            var titlesAndFees = "$209.00";
            document.getElementById("txtMSRP").value = MSRP;
            document.getElementById("txtDestinationCharge").value = destinationCharge;
            document.getElementById("txtRebates").value = rebate;
            document.getElementById("txtTaxes").value = taxes;
            document.getElementById("txtElectricTitleAndFees").value = titlesAndFees;
        }
    </script>
</head>
<body onload="setMSRP()">
    <form>
        <h1>Calculate Focus Price</h1>
        <hr/>
        <label for="txtMSRP">MSRP:</label>
        <input autofocus id="txtMSRP" type="text" readonly="readonly"/>
        <br/>
        <label for="txtDestinationCharge">Destination Charge:</label>
        <input type="text" id="txtDestinationCharge" readonly="readonly"/>
        <br/>
        <label for="txtRebates">Rebates:</label>
        <input type="text" id="txtRebates" readonly="readonly"/>
        <br/>
        <label for="txtTaxes">Taxes:</label>
        <input type="text" id="txtTaxes" readonly="readonly"/>
        <br/>
        <label for="txtElectricTitleAndFees">Electric Title and Fees:</label>
        <input type="text" id="txtElectricTitleAndFees" readonly="readonly"/>
        <br/>
        <input type="button" id="btnCalculateTotal" onclick="calcTotal()" 
    </form>
</body>

2 个答案:

答案 0 :(得分:0)

您在代码中有一些语法错误。请看下面的修改示例:

playbook.yml
[library]
  |_ your_custom_moudle_1.py
  |_ your_custom_moudle_2.py

  

我希望文本框在页面加载时在其中包含值。

您不需要JS:

<html>

  <head>
    <script>
      function setMSRP() {
        var MSRP = "$29,120.00";
        var destinationCharge = "$875.00";
        var rebate = "-$10,000.00";
        var taxes = "6%"
        var titlesAndFees = "$209.00";
        document.getElementById("txtMSRP").value = MSRP;
        document.getElementById("txtDestinationCharge").value = destinationCharge;
        document.getElementById("txtRebates").value = rebate;
        document.getElementById("txtTaxes").value = taxes;
        document.getElementById("txtElectricTitleAndFees").value = titlesAndFees;
      }

    </script>
  </head>

  <body onload="setMSRP()">
    <form>
      <h1>Calculate Focus Price</h1>
      <hr/>
      <label for="txtMSRP">MSRP:</label>
      <input autofocus id="txtMSRP" type="text" readonly="readonly" />
      <br/>
      <label for="txtDestinationCharge">Destination Charge:</label>
      <input type="text" id="txtDestinationCharge" readonly="readonly" />
      <br/>
      <label for="txtRebates">Rebates:</label>
      <input type="text" id="txtRebates" readonly="readonly" />
      <br/>
      <label for="txtTaxes">Taxes:</label>
      <input type="text" id="txtTaxes" readonly="readonly" />
      <br/>
      <label for="txtElectricTitleAndFees">Electric Title and Fees:</label>
      <input type="text" id="txtElectricTitleAndFees" readonly="readonly" />
      <br/>
      <input type="button" id="btnCalculateTotal" onclick="calcTotal()">
    </form>
  </body>

</html>

答案 1 :(得分:0)

如果您想在input[type=text]中使用占位符,只需使用

var textbox = document.querySelector("#textbox");
textbox.setAttribute("placeholder", "This is the Placeholder");

或使用HTML属性设置值/占位符:

<input type="text" id="textbox" value="Hello" placeholder="Introductory Statement" />