如何将动态填充的数字放入输入值字段

时间:2016-07-05 02:22:12

标签: html forms email input

我有来自外部js文件的动态填充值。当我在HTML页面中调用它时,该值正常工作,但我仍然坚持如何让输入字段显示此值。

这是我的HTML:

  <form action="../mail.php" method="POST" class="location-form">

        <div class="device-details">
          <h2>Device: iPhone5</h2>
          <h2>Repair Cost: <span id="result">0</span></h2>
        </div>

        <input name="device" type="hidden" id="device" value="iPhone5" maxlength="20">
        <input name="cost" type="hidden" id="cost" value="" maxlength="20">

        <div class="submit-btn">
            <input type="submit"  value="Submit Request" />
        </div>

  </form>

  <script>
    document.getElementById("result").innerHTML = localStorage.getItem("sum");
  </script>

在顶部,在div&#34;设备详细信息&#34;,h2&#34;修复费用&#34;正好填充价值,没有问题。但我似乎无法使用此值填充最后一个输入。

<input name="cost" type="hidden" id="cost" value="(need the value here)" maxlength="20">

我需要输入字段的值来模仿顶部修复费用的值,以便将该值发送到电子邮件地址。

我已尝试将以下内容插入到该值中,但它无法正常工作

value="<span id='result'>0</span>"

我尝试在php中创建一个变量,然后将变量放入值字段,但它无法正常工作

<?php 
     $my_var = '<span id="result">0</span>';  
?>

value="<?php echo '$my_var'); ?>"

我也尝试过:

value="<?php echo htmlspecialchars($my_var); ?>"

最后两个刚刚返回实际的HTML代码

<span id="result"></span> 

而不是填充值。

1 个答案:

答案 0 :(得分:0)

试试这个。

<!DOCTYPE html>
<html>
<body onload="abc()">
<form action="../mail.php" method="POST" class="location-form">

            <div class="device-details">
              <h2>Device: iPhone5</h2>
              <h2>Repair Cost: <span id="result">0</span></h2>
            </div>

            <input name="device" type="hidden" id="device" value="iPhone5" maxlength="20">
            <input name="cost" type="hidden" id="cost" value="" maxlength="20">

            <div class="submit-btn">
                <input type="submit"  value="Submit Request" />
            </div>

      </form>

      <script>

        function abc(){
        document.getElementById("result").innerHTML=localStorage.getItem("sum");
        document.getElementById("cost").value = localStorage.getItem("sum");
        }
      </script>

    </body>
</html>