91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

怎么使用JS提交表單

js
小億
91
2024-01-19 20:41:35
欄目: 編程語言

使用JavaScript提交表單可以通過以下步驟實現:

  1. 獲取表單元素:可以通過document.getElementById()document.querySelector()等方法獲取表單元素。
var form = document.getElementById("myForm");
  1. 監聽表單提交事件:使用addEventListener()方法監聽表單的submit事件。
form.addEventListener("submit", function(event) {
    event.preventDefault(); // 阻止表單的默認提交行為

    // 在這里執行表單提交的邏輯
});
  1. 獲取表單數據:可以通過表單元素的elements屬性獲取所有表單字段,然后通過字段的name屬性獲取字段名,通過value屬性獲取字段值。
var formData = new FormData(form);
var data = {};

for (var pair of formData.entries()) {
    data[pair[0]] = pair[1];
}
  1. 發送請求:可以使用XMLHttpRequest對象或fetch API發送表單數據到服務器。
var xhr = new XMLHttpRequest();
xhr.open("POST", "submit-url", true);
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");

xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
        // 請求成功處理邏輯
    }
};

xhr.send(JSON.stringify(data));

完整代碼示例:

<form id="myForm">
    <input type="text" name="name" id="name">
    <input type="email" name="email" id="email">
    <button type="submit">提交</button>
</form>

<script>
var form = document.getElementById("myForm");

form.addEventListener("submit", function(event) {
    event.preventDefault();

    var formData = new FormData(form);
    var data = {};

    for (var pair of formData.entries()) {
        data[pair[0]] = pair[1];
    }

    var xhr = new XMLHttpRequest();
    xhr.open("POST", "submit-url", true);
    xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");

    xhr.onreadystatechange = function() {
        if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
            // 請求成功處理邏輯
        }
    };

    xhr.send(JSON.stringify(data));
});
</script>

0
乌海市| 吉水县| 石阡县| 玉山县| 连云港市| 原阳县| 三台县| 中江县| 鹤山市| 长沙市| 桂阳县| 明光市| 沧源| 田阳县| 巴林右旗| 镇原县| 凤阳县| 贞丰县| 苏尼特左旗| 东兴市| 社会| 明水县| 德阳市| 元氏县| 桂东县| 丹寨县| 西安市| 堆龙德庆县| 德惠市| 盘锦市| 连云港市| 福清市| 鸡西市| 灵璧县| 安徽省| 兰西县| 沽源县| 渝北区| 建瓯市| 且末县| 安远县|