表單字段值在刷新onclick = window.print（）

我使用Html5和bootstrap創建了一個允許表單。但是我想包含一個功能，用戶可以在點擊提交按鈕之前將頁面打印出來。所以我在點擊打印按鈕上應用了onclick = window.print（）。但是令人沮喪的是，一旦打印按鈕被點擊，所有的字段值就會被刷新。表單字段值在刷新onclick = window.print（）

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title></title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
</head> 
<body> 

<div class="container"> 
<form class="form-inline" id="sunrise" name="sunrise" method="post" action=""> 
<div class="row"> 
    <div class="form-group"> 
     <label>Father's Name:</label> 
     <input type="text" class="form-control" name="father" placeholder=""> 
    </div></div> <br/> 
    <div class="row"> 
    <div class="form-group"> 
     <label>Mother's Name:&nbsp;</label> 
     <input type="text" class="form-control" name="mother" placeholder=""> 
    </div> 
    </div> 
<br/> 
     <div class="row"> 
    <div class="form-group"> 
     <label>DOB:</label> 
     <input type="date" class="form-control" name="dob" placeholder=""> 
    </div> 
    </div> 
    <button type="Print" class="btn btn-default" id="print" onclick="window.print()">Print Application</button> 
    <button type="submit" class="btn btn-default" name="submit" value="submit">Submit</button> 


    </form> 

    </div> 
</body> 
</html>

來源

2016-08-23 Abhishek

將打印按鈕的無效類型更改爲有效的類型。

<button type="Print" class="btn btn-default" id="print" onclick="window.print()">Print Application</button>

到

<button type="button" class="btn btn-default" id="print" onclick="window.print()">Print Application</button>

由於「打印」類型是無效的，該按鈕有一個形式，這是提交，這使得頁面重新加載裏面的默認行爲。

來源

2016-08-23 18:04:15 yuriy636

非常感謝很多伴侶無法弄清楚這個小小的錯誤。 – Abhishek

最好使用type="button"然後使用type =「print」。因爲它無效。

`<button type="button" class="btn btn-default" id="print" onclick="window.print()">Print Application</button>`

來源

2016-08-23 18:08:31

表單字段值在刷新onclick = window.print（）

回答

相關問題