[英]how to print a specific text in html form on click of a button PHP?
我正在開發基於 php 的密碼生成器，我有一個 html 表單，其中包含網站名稱、用戶名和密碼的輸入。 到目前為止，用戶必須輸入密碼才能對其進行加密和存儲，我想要的是除了密碼輸入表單之外還有一個按鈕，單擊該按鈕時在密碼字段中輸入生成的密碼。
這是我正在使用的表格-
</head>
<body
<form class="form" method="post">
<!--Input Fields-->
<input type="text" name="website" placeholder="Website" required autocomplete="off"> <br>
<input type="text" name="username" placeholder="Username" required autocomplete="off"> <br>
<input type="password" name="password" placeholder="Password" required autocomplete="off"> <br>
<input type="submit" name="submit" value="SAVE" class="submit">
</form>
</div>
這是 function 我想在按下按鈕時執行-
function password_generate($chars)
{
$Uppercase="ABCDEFGHIJKLMNOPQRSTUVWXYZ";
$Lowercase="abcdefghijklmnopqrstuvwxyz";
$Numbers="1234567890";
$Symbols="!@#$&*+_?%";
$data = $Uppercase.$Lowercase.$Numbers.$Symbols;
return substr(str_shuffle($data), 0, $chars);
}
使用 PHP 和 JavaScript 可以輕松實現。
PHP 代碼：
<body
<form class="form" method="post">
<!--Input Fields-->
<input type="text" name="website" placeholder="Website" required autocomplete="off"> <br>
<input type="text" name="username" placeholder="Username" required autocomplete="off"> <br>
<input type="password" name="password" placeholder="Password" required autocomplete="off"> <br>
<input type="button" class="button" value="Generate" onClick="randomPassword(10);" tabindex="2"> <br>
<input type="submit" name="submit" value="SAVE" class="submit">
</form>
</div>
JS代碼：
<script>
function randomPassword(length) {
var chars = "abcdefghijklmnopqrstuvwxyz!@#$%^&*()-+<>ABCDEFGHIJKLMNOP1234567890";
var pass = "";
for (var x = 0; x < length; x++) {
var i = Math.floor(Math.random() * chars.length);
pass += chars.charAt(i);
}
myform.password.value = pass;
}
</script>
希望這對你有用。
它會生成與您在 PHP function 中提到的相同的隨機密碼。
var pass = "(return substr(str_shuffle($data), 0, $chars));
這是一個 JavaScript function 的簡單示例，它（偽）隨機生成密碼並設置密碼字段。
由於默認情況下密碼字段不顯示值，因此本示例將生成的密碼放在頁面上的<span>標記中。 這並不理想，僅用於演示目的。 理想情況下，密碼只會出現在密碼字段中，用戶將切換是否顯示密碼。 但是因為我不知道你的頁面的完整設置以及你在做什么，所以我在我的演示中這樣做了。
function _RandomPassword(len) { let chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890?@#$&*+_,%"; suggestion = ""; for(let i = 0; i < len. i++) suggestion += chars.split(""),sort((a. b) => Math.round(Math.random()*a.charCodeAt()) - Math.round(Math.random()*b.charCodeAt())).splice(-1);join(""). document.querySelector("#suggestion");textContent = suggestion. document.querySelector("[name='password']");value = suggestion; }
<form class="form" method="post"> <!--Input Fields--> <input type="text" name="website" placeholder="Website" required autocomplete="off"> <br> <input type="text" name="username" placeholder="Username" required autocomplete="off"> <br> <input type="password" name="password" placeholder="Password" required autocomplete="off"> <br> <span id="suggestion"></span> <input type="button" value="*Suggest*" onclick="_RandomPassword(8)"> <br> <input type="submit" name="submit" value="SAVE" class="submit"> </form>
此密碼 function 采用 1 個參數（密碼長度為len ），然后將您的字符列表轉換為數組，隨機排序，並取最后一個字符。 它循環並執行此操作，無論密碼需要多長時間，然后將該值放入密碼字段以及頁面上的<span>標記中。
按下 html 按鈕時，在表單字段中獲取自動生成的密碼的正確答案和代碼片段在這里 -
<!DOCTYPE html>
<html lang="en">
<head>
<title>Answer by @Ashutosh_7i</title>
</head>
<body>
<form class="form" method="post">
<input type="text" name="website" placeholder="Website" required autocomplete="off"> <br>
<input type="text" name="username" placeholder="Username" required autocomplete="off"> <br>
<input type="password" name="password" placeholder="Password" required autocomplete="off"> <br>
<span id="suggestion"></span> <input type="button" value="*Suggest*" onclick="_RandomPassword(8)"> <br>
<input type="submit" name="submit" value="SAVE" class="submit">
</form>
<script>
function _RandomPassword(len) {
let chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz1234567890!@#$&*+_?%",
suggestion = "";
for(let i = 0; i < len; i++) suggestion += chars.split("").sort((a, b) => Math.round(Math.random()*a.charCodeAt()) - Math.round(Math.random()*b.charCodeAt())).splice(-1).join("");
document.querySelector("#suggestion").textContent = suggestion;
document.querySelector("[name='password']").value = suggestion;
}
</script>
</form>
</body>
</html>
如何在單擊按鈕時添加具有html形式的特定設計的文本框
[英]How to add specific designed textbox which is of html form on button click
單擊按鈕重定向到不同的 HTML 文件后，如何在 DOM 上打印特定的數組索引？
[英]How can I print a specific Index of an Array on the DOM after a button click redirecting to a different HTML file?
如何使用 HTML 或 JavaScript 將特定代碼塊中的文本復制到剪貼板？
[英]How can I copy text in a specific code block to the clipboard on button click with HTML or JavaScript?
如何通過單擊按鈕在html div的中間打印/附加一個值？
[英]How to print / append on the middle of the html div a value from a button click?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.