将值附加到表单

Question

我试图从表单中获取值并将其附加到表单，然后将该值作为参数传递

脚本

$(document).ready(function() {
$('#buttonClick').on('click', 'button',function firstCall(){

var form = new FormData();
form.append("name", "test");
form.append("phone", "2245201905");
form.append("url", "this_url");
var settings = {
  "async": true,
  "crossDomain": true,
  "url": "url_path",
  "method": "POST",
  "processData": false,
  "contentType": false,
  "mimeType": "multipart/form-data",
  "data": form
}

$.ajax(settings).done(function (response) {
  console.log(response);
});});
});

HTML

 <form method="post" id="formSample">
 <div class="form-group">
      <label for="name">Name</label>
      <input type="text" id="name" placeholder="Fullname">
 </div>
 <div class="form-group">
      <label for="phone">phone</label>
      <input type="number" name="phone" placeholder="number">
 </div>
 <div id="buttonClick">
 <button >Submit</button></div>

在我的脚本中，我硬编码了 name、phone 和 url 的值，它正在工作，我无法从表单中附加值。所以我正在寻找

form.append("name", "(document.getElementById('name').value");

同样在单击按钮时，我无法传递数据，因为我已发出警报，但我的代码没有进入功能

注意：我还没有处理 url 部分

原文由 raulxbox 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

要使用实际 HTML 中的值创建 FormData，您可以将该表单作为参数传递给表单数据

<form id="myForm">
   <input type="text" id="name" name="name" placeholder="Fullname">
   <input type="text" id="phone" name="phone" placeholder="Phone">
</form>
<script>
var myform = document.getElementById('myForm');
var form = new FormData(myform);
// form will have name and phone
form.append("url", window.location.href);

$.ajax(settings).done(function (response) {
   if (response.success) {
      // Only do something if the response data has success key.
   }
});});
</script>

原文由 James 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

form.append("name", "(document.getElementById('name').value");

你在这里附加一个字符串。只需删除“

 form.append("name", document.getElementById('name').value);

另外，您可能想仔细看看 javascript 中的匿名 函数 和 数据类型

原文由 Timo Jokinen 发布，翻译遵循 CC BY-SA 3.0 许可协议