Détails de la configuration Ajax, explication de l'appel ajax, caractères chinois tronqués ajax et soumission du formulaire ajax (avec exemples inclus)

Cet article parle principalement du résumé de l'utilisation de ajax, ainsi que des explications détaillées de la configuration d'ajax, des appels, des caractères chinois tronqués, de la soumission de formulaires, etc. Jetons maintenant un œil ensemble à cet article

·L'utilisation de jquery
0. jquery.js doit être introduit en premier, sinon le framework jquery ne peut pas être appelé
1. js est sensible à la casse, veuillez faire attention lorsque naming
2. jquery obtient la valeur du texte de la page en fonction de l'attribut id de p : $("#demoID").val(), et obtient la valeur du texte de la page en fonction de l'attribut de classe $(" .demoCLASS").val(), s'il s'agit d'une affectation $(" #demoID").val("Assigned settings")
3. $(document).ready(function(){code}), $ ().ready(function(){code}), $(function (){code}) ont la même signification
4. Plusieurs $(function(){code}) peuvent coexister, c'est-à-dire qu'ils peuvent fonctionner en même temps tant que les noms ne sont pas répétés
5. $(function(){code} ) signifie s'exécuter dès que la page est chargée, comme un clic automatique, une pop-up automatique ou une surveillance des clics ou autre surveillance
6. La différence entre cliquer après le chargement et "surveillance des clics" (très utile pour référence)
Par exemple, il existe maintenant une méthode js, function demoFunction(){alert("Cette méthode est en cours d'exécution" );};
Cliquez après le chargement : $("#demoid").click(demoFunction());
Écoutez après le chargement Cette méthode ne peut être utilisée que lorsque le bouton a une action de clic, ou via un clic jquery. () action : $("#demoid").click(function(){demoFunction()});
7. S'il est automatiquement chargé et exécuté, ou s'il doit être surveillé, il doit être placé dans le code de $(document).ready(function(){code})
8. window.onload=function(){ La différence entre code} et $(function(){code})
·L'utilisation d'appel des fonctions est différent :
window.onload = function(){code};
$(function(){code})
·L'heure d'appel de la fonction est différente
Window.load =function(){code} : vous devez attendre que tout le contenu de la page Web soit chargé (y compris les images) avant de pouvoir l'exécuter, comme le téléchargement et d'autres fonctions.
$(function(){code}), il peut être exécuté une fois que toutes les structures DOM de la page Web ont été dessinées.
9. Sujet AJAX
·Paquets jar requis : commons-lang-2.5.jar, commons-lang3-3.1.jar, javassist-3.11.0.GA.jar
·Comment écrire un front-end js : Afin de simplifier le processus, il est écrit pour s'exécuter lorsque la page est chargée

·Code java backend : seulement proche de l'appel ajax, il n'implique donc pas d'opérations de base de données.

url : "testajax.do",// 请求地址
//timeout : 600000,//超时时间设置，单位毫秒
async : false,// 异步
cache : false,// 缓存
type : 'post',// 请求方式
data: {"name":"123"},//data: $('#formid').serialize(),//序列化表单-当触发一个form表单提交的ajax事件的时候，这个序列化方法自动将数据转化为json格式传递给后台
dataType : 'json',// 服务器返回的数据类型
success : function(msg) {// 请求成功后调用的
alert("返回json的实验成功了"+" msg.resultcode="+msg.resultcode+" msg.name="+msg.name);
},
error :function(){
alert("异常");
}
});
      });

      <?xml version="1.0" encoding="UTF-8"?>
      <!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
    "http://struts.apache.org/dtds/struts-2.3.dtd">
    <struts>
    <!--略去一些struts2的配置信息-->
<package name="myajax" extends="json-default" namespace="/">
<global-results>
<result name="message" type="json">
<param name="root">message</param>
</result>
</global-results>
<action name="*" class="demo.action.AjaxTest" method="{1}">
        <result name="list">/index.jsp</result>
       </action>
</package> 
<!-- 包含的其他配置文件 -->
<include file="struts-method.xml"></include>
    </struts>

·Données du formulaire de soumission de candidature Ajax - les données du formulaire sont automatiquement converties au format json

Description du scénario : lorsque les informations de soumission spécifiques sont un formulaire et sont transmises en arrière-plan via ajax, nous utilisons généralement une méthode appelée sérialisation pour convertir le formulaire au format json pour la livraison Pour le backend (Si vous souhaitez en savoir plus, rendez-vous sur le site Web PHP chinois
Colonne Manuel de développement AJAX

pour apprendre)

    import java.io.IOException;
    import java.io.PrintWriter;
    import java.util.HashMap;
    import java.util.Map;
    import javax.servlet.http.HttpServletResponse;
    import org.apache.struts2.ServletActionContext;
    public class AjaxTest {
protected Map<String, Object> message = new HashMap<String, Object>();
/** AJAX请求返回RESULT的name常量*/
protected final static String MESSAGE = "message";
public Map<String, Object> getMessage() {
return message;
}
public void setMessage(Map<String, Object> message) {
this.message = message;
}
//-登录页面中form表单提交的路径
public String testajax() throws IOException{
System.out.println("获取参数name="+ServletActionContext.getRequest().getParameter("name"));
message.put("resultcode", "0000");
message.put("resultcode", "0001");
message.put("name", "zhong文ce试");
return MESSAGE;
}
     }

·Format du formulaire, la balise form a un identifiant et la balise input a un nom

·La partie js du code - peut être. écrit dans un fichier js séparément. Notez que le fichier jquery.js doit être introduit en premier

Cet article C'est tout (Si vous voulez en savoir plus, rendez-vous sur le site PHP chinois.

     <form  id="formid"> 
姓名：<input type="text" name="name" value="张三"/><br>
年龄：<input type="text" name="age" value="12"/><br>
<input type="submit" value="提交" id="submitid"/>
     </form>

Manuel d'utilisation AJAX

colonne pour apprendre). Si vous avez des questions, vous pouvez laisser un message ci-dessous

.

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!