我是一名初学者编码器，我想制作一个联系表单，将 json 对象发送到另一个 php 文件。这是我当前的代码
[...]
<body>
<form id="form" class="formular">
<div class="input-group">
<input id="phone" type="tel" class="form-control" name="phone" placeholder="phone" required>
</div>
<br>
<div class="input-group">
<input type="email" id="email" class="form-control" name="email" placeholder="mail" required>
</div>
<br>
<div class="input-group">
<textarea id="message" class="form-control" placeholder="message..." required></textarea>
</div>
<button id="form_submit_button" name="form_submit_button">Send!</button>
</form>
</body>
</html>
<?php
?>
<script>
jQuery(document).ready(function($) {
$("#form_submit_button").click(function (event) {
event.preventDefault();
$.ajax({
type: 'POST',
url: 'test.php',
data: JSON.stringify({ Form: $('#form').val }),
contentType: "application/json; charset=utf-8",
dataType: "json",
})
});
});
</script>test.php 简单来说就是: var_dump($_POST); 当然它总是 0。有人可以帮助我吗:)
最佳答案
您想要做的是使用 AJAX 发送表单的内容。正如 NVRM 所指出的，您不需要使用 jQuery 来执行此操作。您可以使用 native 获取功能。
const form = document.getElementById('form');
form.onsubmit = (e) => {
e.preventDefault();
const phone = document.getElementById('phone').value;
const email = document.getElementById('email').value;
const message = document.getElementById('message').value;
const data = new FormData();
data.append('phone', phone);
data.append('email', email);
data.append('message', message);
fetch("test.php", {
method: "POST",
body: data
});
}<form id="form" class="formular">
<div class="input-group">
<input id="phone" type="tel" class="form-control" name="phone" placeholder="phone" required>
</div>
<br>
<div class="input-group">
<input type="email" id="email" class="form-control" name="email" placeholder="mail" required>
</div>
<br>
<div class="input-group">
<textarea id="message" class="form-control" placeholder="message..." required></textarea>
</div>
<button id="form_submit_button" name="form_submit_button">Send!</button>
</form>首先，将每个表单字段的值放入变量中，然后将它们插入到 FormData 对象中。然后使用 fetch 函数将 FormData 对象发送到服务器，可以通过 $_POST 变量访问该对象。
您最初的内容是 $('#form').val() ，它不会返回任何内容，因为 #form 是表单元素，它不会返回任何内容t 有一个值。
关于javascript - 如何使用 ajax 发布 json 对象？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59380212/