gpt4 book ai didi

javascript - jquery ajax 调用不在 firefox 中执行

转载 作者:行者123 更新时间:2023-11-30 09:57:58 24 4
gpt4 key购买 nike

这个问题是关于 this 的后续问题问题和this一。我无法通过 jquery 的 ajax api 发送表单字段值。代码如下:

index.html

<!DOCTYPE html>
<html>

<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">

<link rel="stylesheet" type="text/css" href="index.css">

<script src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script type="text/javascript" src="index.js"></script>

</head>

<body onload="welcome()">

<div class id="main"></div>

</body>
</html>

欢迎功能在index.js中实现:

index.js

function welcome()
{
view_account();
}

function get_form_data_with_token($form){
var unindexed_array = $form.serializeArray();
var indexed_array = {};

$.map(unindexed_array, function(n, i){
indexed_array[n['name']] = n['value'];
});

indexed_array['token'] = 'adafdafdgfdag';

return indexed_array;
}

$(document).ready(function(){
$("#changepassword_form_id").submit(function(e){
var uri, method, formId, $form, form_data;
// Prevent default jquery submit
e.preventDefault();
e.stopImmediatePropagation();

uri = location.protocol + '//' + location.host + "/change_password";
method = "POST";
formId = "#changepassword_form_id";

$form = $(formId);
form_data = get_form_data_with_token($form);

alert("form_data: token = " + form_data['token'] + " password3 = " + form_data['l_password3'] + " password4 = " + form_data['l_password4']);

// Set-up ajax call
var request = {
url: uri,
type: method,
contentType: "application/json",
accepts: "application/json",
cache: false,
// Setting async to false to give enough time to initialize the local storage with the "token" key
async: false,
dataType: "json",
data: form_data
};
// Make the request
$.ajax(request).done(function(data) { // Handle the response
// Attributes are retrieved as object.attribute_name
console.log("Data from change password from server: " + data);
alert(data.message);
}).fail(function(jqXHR, textStatus, errorThrown) { // Handle failure
console.log(JSON.stringify(jqXHR));
console.log("AJAX error on changing password: " + textStatus + ' : ' + errorThrown);
}
);

});
});

function view_account()
{
var changePassword;

changePassword = "<form action=\"/change_password\" id=\"changepassword_form_id\" method=\"post\">";
changePassword = changePassword + "<br><label>Old Password: </label><input id=\"password3\" type=\"password\" name=\"l_password3\" required><br>";
changePassword = changePassword + "<br><label>New Password: </label><input id=\"password4\" type=\"password\" name=\"l_password4\" required><br><br>";
changePassword = changePassword + "<input type=\"submit\" value=\"Change Password\">";
changePassword = changePassword + "</form>";

// Replace the original html
document.getElementById("main").innerHTML = changePassword;

}

即使如 this 中所述使用了 dom 就绪事件,也不会执行 onsubmit 处理程序问题。

如何使用 jquery 的 ajax api 只提交一次字段?

编辑:

jsfiddle上一个问题的例子。即使代码在 jsfiddle 上运行,它在 fire fox 中运行时也会失败。

最佳答案

像这样使用 on 事件处理程序:

$(document).on("submit","#changepassword_form_id",function(e){
...code here...
});

这是委托(delegate)它,因为 #changepassword_form_id 尚未在 document.ready 上定义。

由于您在输入上使用了 required 属性并且需要检查填写的表单,因此您可以使用 submit 事件。

关于javascript - jquery ajax 调用不在 firefox 中执行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33131244/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com