堆棧內存溢出
  簡體   English   中英

我需要在提交的同一頁上打印以HTML表單輸入的值

[英]I need to print the values entered in an HTML form on the same page on submit

 原文  2013-12-06 04:49:50  3   2    javascript/ html

問題描述

hotmail我需要輸入表單中的值才能在按下提交時在屏幕上打印出來。 我該怎么做Javascript來做到這一點。 我不知道從哪里開始，所以請幫忙！

它還看起來格式正確嗎，我覺得我缺少了一些東西，並且使用表格進行格式化可能是錯誤的方法。 

  <script type="text/javascript">
info = document.getElementById("personalInfo");
    info.innerHTML = "<strong>Peronal Info: </strong>" + "<br>" + "Name: " + 
                    document.feedback.fname.value +
                    " " +
                    document.feedback.lname.value +
                    "<br>" + "Email: " +
                    document.feedback.email.value;

info = document.getElementById("experienceSubmit");
    info.innerHTML = "<strong>Experience and Salary: </strong>" + "<br>" + "Years of experience: " + 
                    document.feedback.experience.value +
                    "<br>" + "Date of availability: " +
                    document.feedback.date.value +
                    "<br>" + "Compensation Chosen: " +
                    document.feedback.comp.value +
                    "<br>" + "Region Selected: " +
                    document.feedback.region.value;

info = document.getElementById("otherSubmit");
    info.innerHTML = "<strong>Other information: </strong>" + "<br>" + "# of References " + 
                    document.feedback.reference.value +
                    "<br>" + "Additional Comments: " +
                    document.feedback.comments.value; 
return false;
}
</script>
</head>
<body background="../Assignment 5/_images/abstract_color_background_picture_8016-wide.jpg" >
<form   name="feedback" method="post" onSubmit="return checkform()">
        <section  id="pinfo" class="inputArea">
        <fieldset>
            <table>
                <tr>
                    <td>Last Name: </td>
                    <td><input name="lname"
                               type="text"
                               autofocus
                               required
                               placeholder="lname"                               
                               size="25" />
                    </td>
                </tr>                   
                <tr>
                    <td>First Name: </td>
                    <td><input name="fname"
                               type="text"
                               size="25"
                               required
                               placeholder="fname" />
                    </td>
                </tr>
                <tr>
                    <td>Email: </td>
                    <td><input name="email"
                               type="email"
                               size="40"
                               required
                               placeholder="....@hotmail.com" />
                     </td>
                </tr>
                    <td>Gender: </td>
                    <td><select name="gender">
                            <option selected disabled style='display:none;'>
                            Gender</option>                         
                            <option value="Male">Male</option>
                            <option value="Female">Female</option>                      
                        </select>

                </td>
                </tr>
            </table>
            </fieldset>
</section>
<section id="experience">
            <fieldset>
            <table>
                <tr>
                    <td>
                    <label for="experience">Years of Experience: </label>
                    <input name="experience" type="number" />
                  </td>
              </tr>
              <tr>
                    <td>
                        <label for="date">Date</label>
                        <input name="date" type="date" />
                    </td>
              <tr>
                    <td>
                        <label for="comp">Compensation: </label><br>
                        <input name="comp" type="radio" id="Salary" value="Salary Selected">Salary &nbsp;
                        <input name="comp" type="radio" id="SalaryWB" value="Salary with bonus Selected">Salary with Bonus &nbsp;
                        <input name="comp" type="radio" id="Commission" value="Commission Selected">Commission &nbsp;
                    </td>
              </tr>
              <tr>
                <td>
                    <label for="region">Region: </label><br>
                    <input name="region" type="checkbox" id="East" value="East Selected">East &nbsp;
                    <input name="region" type="checkbox" id="West" value="West Selected">West &nbsp;
                    <input name="region" type="checkbox" id="North" value="North Selected">North &nbsp;
                    <input name="region" type="checkbox" id="South" value="South Selected">South &nbsp;
                </td>
              </tr>
          </table>
          </fieldset>
</section>
<section id="other">
<fieldset>
          <table>
            <tr>
                <td>
                <label for="reference">References<br>0&nbsp;&nbsp 1 &nbsp;&nbsp 2 &nbsp&nbsp 3 &nbsp&nbsp 4 &nbsp&nbsp 5<br></label>
            <input name="reference" id="reference"
                    type="range" 
                    value="0"
                    min="0"
                    max="5"
                    step="1" />
                </td>
            </tr>
            <tr>
                <td>
                    <label for="comments">Additional Comments: <br></label>
                    <textarea 
                    name="comments"
                    rows="5" 
                    cols="20" 
                    placeholder="Please include any other pertinent information here"></textarea>                   </td>
            </tr>          
          </table>          
</fieldset>

        <input type="submit" value="Submit" />
        <input type="reset" value="Clear" />
</section>
</form>
<section id="personalInfo"></section>
<section id="experienceSubmit"></section>
<section id="otherSubmit"></section>
</body>

2 個解決方案

解決方案1
 0  2013-12-06 05:00:15

是的，在onsubmit checkform（）函數中可以對打印值進行編碼...

喜歡... 

<script>
    function checkform()
    {
         document.getElementById("outL").innerHTML=feedback.lname.value;
        //like this you can do for all field
    }
</script>

解決方案2
 -1  2013-12-06 05:04:26

我已經為您創建了示例。 請檢查下面的代碼 

$("#feedback").submit(function(e){
    alert("hi");
    event.preventDefault();
});

鏈接

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 提交后如何在同一頁中顯示html表單值？ 提交HTML表單以在新頁面中顯示輸入的信息 我需要使用Javascript將復選框中的值打印到HTML頁面中 我需要一種表單，如果選中了表單中的復選框，然后將“提交”按鈕打印頁面，該表單會將一個類應用於div 用戶輸入提交后，如何在同一頁面中打印出表單字段值？ HTML提交表單，但留在同一頁面上 html 表格，提交並停留在頁面的同一位置 如何將在一個 html 頁面表單上輸入的值作為變量輸入到另一個 html 頁面上 使用 javaScript 提交后，在同一頁面的超鏈接內顯示 html 表單值 如何讓表單將值提交到同一頁面上的ng-repeat列表項？
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM