表單是 javascript 或 jquery 中非常有趣的元素（在這種情況下）。這是我的問題：JS：const themeFolder = object_name.templateUrl;const urlAjax = themeFolder + '/FormHandler.php';const form = $('#contact-form');const outputmessage = $('.output-message');form.submit(function(e) { e.preventDefault(); $.ajax({ type: 'post', url: urlAjax, method: form.attr('method'), data: form.serialize() + '&submit=true', success: function (result) { console.log(result); outputmessage.append('<p>A message was sent successfully!</p>'); } });});PHP：if ($ok == true && isset($_POST['submit']) && empty( $honeypot )) { $json_tidy = json_encode($_POST); echo $json_tidy;} else { echo 'something wrong';}現在，我沒有得到的是這樣一個事實，即我可以使用相同的值多次發送相同的表單，但我沒有找到只發送一次表單并在完成后立即禁用表單的解決方案?？赡芪蚁攵嗔?，但例如， json_tidy 會發布這個結果：{"fname":"ma","lname":"ma","email":"[email protected]","message":"ciao","honeypot":"","submit":"true"}</body>這對我來說沒有多大意義。另外在這種情況下，我正在努力尋找一個值來識別我將發送多少次表單的計數器。我可以在 form.submit(function(e) {} 之后和 javascript 的 and 處使用 return true 和 false，但它只會避免我的 js 腳本運行和觸發我的 php 腳本形式：<form id="contact-form" name="contact-form" action="{{ theme.link }}/FormHandler.php" method="POST">我想知道過去是否有人遇到過同樣的問題
2 回答
UYOU
TA貢獻1878條經驗 獲得超4個贊
布爾變量怎么樣？
// outer scope
let hasSubmitted = false;
//...
form.submit(function(e) {
if(hasSubmitted)return;
hasSubmitted = true;
//...
或者：
const submitButton = $("#submit-button")
form.submit(function(e) {
submitButton.disabled = true;
慕標5832272
TA貢獻1966條經驗 獲得超4個贊
您可以在發送表單后立即刪除submit事件處理程序，因此不會再次發送表單。
根據您使用的 jQuery 版本，您可以使用
$form.submit(false);
或者：
$form.off('submit');
$form.on('submit', (e) => e.preventDefault());
另一種選擇是禁用提交按鈕和可選的輸入字段：
const $form = $('#form');
const $message = $('#message');
const $submit = $('#submit');
$form.submit((e) => {
e.preventDefault();
// Option 1: Remove submit event handler:
$form.off('submit');
$form.on('submit', (e) => e.preventDefault());
// Option 2: Disable the submit button:
$submit.prop('disabled', true);
// Disable all input fields (optional):
$form.find('input, textarea').prop('disabled', true);
// Add feedback message:
$message.text('Sending message...');
// Simulate request:
setTimeout(() => {
// Update feedback message:
$message.text('The message was sent successfully!');
}, 2000)
});
body {
font-family: monospace;
font-size: 16px;
margin: 0;
}
#form {
width: 50vw;
margin: 0 auto;
}
input,
textarea,
button {
display: block;
width: 100%;
padding: 8px;
margin-top: 8px;
box-sizing: border-box;
border: 2px solid black;
background: transparent;
font-family: monospace;
font-size: 16px;
}
#message {
margin-top: 8px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="form">
<input type="text" placeholder="Subject" />
<textarea placeholder="Message"></textarea>
<div id="message"></div>
<button type="submit" id="submit">Send</button>
</form>
- 2 回答
- 0 關注
- 104 瀏覽
添加回答
舉報
0/150
提交
取消