Wie das Validate-Plug-in von jQuery Eingabewerte validiert

Dieses Mal zeige ich Ihnen, wie das Validate-Plug-in von jQuery den Eingabewert überprüft Schauen Sie mal rein. Der folgende Editor wird Ihnen ein Beispiel für die Ajax-Methode des jQuery Validate-Plugins zur Validierung von Eingabewerten vorstellen. Sie hat einen guten Referenzwert und ich hoffe, dass sie für alle hilfreich ist. Folgen wir dem Editor und werfen wir einen Blick darauf

In Projekten stoßen wir häufig auf Probleme, die eine Hintergrundüberprüfung erfordern, z. B. ob der Benutzername und das Benutzerkonto vorhanden sind usw. Verwenden Sie das jQuery Validate-Plug-in, um die Überprüfung mithilfe von Remote-Überprüfungsregeln abzuschließen.

Beispiel:

1. Grundlegende Verwendung

1 Formular

<form id="registForm"> 
 <input type="text" id="username" name="username"> 
</form>

2.js

verwendet Remote-Überprüfungsregeln. Die einfachste und gröbste Art, es zu schreiben, ist remote: URL, die hinter dem steht Angeforderte URL. Fügen Sie den aktuell überprüften Wert automatisch zusammen, z. B. lautet die angeforderte URL: xxx/checkUsername.do?username=test

// 导入jquery、validte库略
$(function() {
	$.validator.setDefaults({
		submitHandler: function(form) {
			// 验证通过处理
			...
		}
	});				
	$("#registForm").validate({
		rules: {
			username: {
				required: true,
				remote: "checkUsername.do"
			},			
		},
		messages: {
			username: {
				required: "用户名不能为空",
				remote: "用户名已经存在"
			}
		}
	});
});

3 )

Die Hintergrundantwort kann nur „true“ oder „false“ ausgeben und keine anderen Daten enthalten: „true“: Überprüfung bestanden, „false“: Überprüfung fehlgeschlagen. Sie können den Rückgabetyp auf „Boolean“ oder „String“ festlegen 🎜>

(1). Rückgabewert

(2). Rückgabewert

@RequestMapping("/checkUsername")
public @ResponseBody boolean checkUsername(@RequestParam String username) {
	// 测试
	return !"test".equals(username);
}

2. Andere Verwendungen

@RequestMapping("/checkUsername")
public @ResponseBody String checkUsername(@RequestParam String username) {
	// 测试
	return !"test".equals(username) ? "true" : "false";
}

Die obige Verwendung kann die tatsächlichen Anforderungen nicht erfüllen. Manchmal müssen andere Parameter übermittelt werden, die Parameternamen und Attributnamen sind inkonsistent oder die Anforderungsmethode lautet POST.

1.js

Verwenden Sie die Datenoption, mit der $.ajax({...}) von jQuery geschrieben wird Die übermittelten Daten müssen von einer Funktion zurückgegeben werden, und es gibt ein Problem beim direkten Schreiben des Werts. ;Der aktuell überprüfte Wert wird standardmäßig übermittelt, d. h. der Benutzername im folgenden Beispiel: xxx standardmäßig als Parameter übermittelt werden

2. Backend

Beschränkt auf POST-Anfragen

....
username: {
	required: true,
	remote: {
		url: "checkUsername.do",
		type: "post",    //数据发送方式
		dataType: "json",   //接受数据格式 
		data: {      //要传递的数据
			username: function() {
				return $("#username").val();
			},
			extra: function() {
				return "额外信息";
			}
		 }
	}
}

Ich glaube, Sie beherrschen das Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website, nachdem Sie den Fall gelesen haben.

Empfohlene Lektüre:

@RequestMapping(value = "/checkUsername", method = RequestMethod.POST)
public @ResponseBody boolean checkUsername(User user, @RequestParam String extra) {
	// 测试
	System.out.println(extra);
	return !"test".equals(user.getUsername());
}

So konvertieren Sie automatisch Groß- und Kleinbuchstaben, wenn Jackson JSON-Strings analysiert

Nach der Ajax-Anfrage für Hintergrunddaten ist erfolgreich. Wie man mit fehlender Reflexion umgeht

Verwendung des jQuery EasyUI-Akkordeon-Panels

Verwendung von Tabulatoren in jQuery EasyUI-Registerkartenfeld

Das obige ist der detaillierte Inhalt vonWie das Validate-Plug-in von jQuery Eingabewerte validiert. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!