Une solution au problème de deux soumissions en un seul clic lors d'une requête Ajax pour un bouton

La raison pour laquelle des requêtes comme ajax sont soumises deux fois est qu'après l'exécution de la requête ajax, le comportement de soumission n'est pas bloqué. L'éditeur ci-dessous vous proposera deux types de boutons. ajaxLa solution consiste à cliquer une fois et à soumettre deux fois lors de la demande. Les amis intéressés par ajax devraient jeter un œil au type de bouton

sur la page est soumettre de. : e97b6ef8681a29e34cde66596ff86abf

requête ajax, dans JQuery est :

$(function () {
$('#submit').click(function () {
var createGenreForm = $('#createGenreForm');
if (createGenreForm.valid()) {
var obj = {
Name: $('#Name').val(),
Description: $('#Description').val()
};
var jsonSerialized = JSON.stringify(obj);
$.ajax({
type: "POST",
url: createGenreForm.attr('action'),
dataType: "json",
contentType: "application/json; charset=utf-8",
data: jsonSerialized,
success: function (result) {
alert(result.Message);
},
error: function (error) {
alert("There was an error posting the data to the server: " + error.responseText);
}
});
}
});
});

La raison pour laquelle deux soumissions se sont produites est qu'après l'exécution de la requête ajax, le comportement de soumission n'a pas été bloqué, donc la solution Il y a deux méthodes :

1. Au lieu d'utiliser un bouton de type soumettre, utilisez un bouton de type bouton.

2. Dans la fonction $('#submit').click, ajoutez une ligne return false à la fin pour empêcher la soumission.

Une petite explication : Pourquoi devrait-on intégrer l'anglais dans le titre ? La raison est de permettre aux internautes étrangers d'interroger cet article. Lorsque je recherche habituellement des informations sur Google, je me réfère souvent aux blogs d'internautes étrangers, qui m'aident à résoudre de nombreux problèmes, je souhaite donc aussi qu'ils puissent se référer au contenu que j'ai écrit. Bien sûr, je ne peux pas tout traduire dans l'article en anglais, alors je fais de mon mieux pour coller tout le code et laisser le code parler de lui-même.

Ce qui précède est la solution que l'éditeur vous présente pour cliquer deux fois pour soumettre la requête Ajax du bouton. J'espère que cela sera utile à tout le monde ! !

Recommandations associées :

Exemple de méthode d'Ajax manuscrit pour implémenter l'actualisation asynchrone

Exemple d'analyse d'Ajax asynchrone technologie de requête

Exemple détaillé du principe de la requête inter-domaines Ajax

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!