在表单提交前进行验证的几种方式整理【javascript】

web前端|js教程在表单提交前进行验证的几种方式整理【javascript】

表单提交,验证

web前端-js教程

在表单提交前进行验证的几种方式 .
在Django中，为了减轻后台压力，可以利用JavaScript在表单提交前对表单数据进行验证。下面提供了有效的几种方式（每个.html文件为一种方式）。
formpage1.html

支付页面源码下载,vscode扩展管理,ubuntu ..,tomcat线程重复,sqlite文件怎么寻址,下拉联想插件,做管理系统的前端框架,爬虫获取不到iframe内容,php 日期时间戳转,react优化seo,卖服务器的网站源码,网页中显示html代码,javascript模板库lzw

 
Example1 
function jump() 
{ 
//清空表单所有数据 
document.getElementById("firstname").value="" 
document.getElementById("lastname").value="" 
$("#firstnameLabel").text("") 
$("#lastnameLabel").text("") 
} 
$(document).ready(function(){ 
$("#form1").bind("submit", function(){ 
var txt_firstname = $.trim($("#firstname").attr("value")) 
var txt_lastname = $.trim($("#lastname").attr("value")) 
$("#firstnameLabel").text("") 
$("#lastnameLabel").text("") 
var isSuccess = 1; 
if(txt_firstname.length == 0) 
{ 
$("#firstnameLabel").text("firstname不能为空！") 
$("#firstnameLabel").css({"color":"red"}); 
isSuccess = 0; 
} 
if(txt_lastname.length == 0) 
{ 
$("#lastnameLabel").text("lastname不能为空！") 
$("#lastnameLabel").css({"color":"red"}); 
isSuccess = 0; 
} 
if(isSuccess == 0) 
{ 
return false; 
} 
}) 
}) 
提交表单前进行验证(方法一) 
 











  first_name:    
  last_name:

formpage2.html

秒表jquery源码,ubuntu 文字无颜色,爬虫还原网页结构,中文php ide,重庆可靠seolzw

 
Example2 
function jump() 
{ 
//清空表单所有数据 
document.getElementById("firstname").value="" 
document.getElementById("lastname").value="" 
$("#firstnameLabel").text("") 
$("#lastnameLabel").text("") 
} 
function check(){ 
var txt_firstname = $.trim($("#firstname").attr("value")) 
var txt_lastname = $.trim($("#lastname").attr("value")) 
$("#firstnameLabel").text("") 
$("#lastnameLabel").text("") 
var isSuccess = 1; 
if(txt_firstname.length == 0) 
{ 
$("#firstnameLabel").text("firstname不能为空！") 
$("#firstnameLabel").css({"color":"red"}); 
isSuccess = 0; 
} 
if(txt_lastname.length == 0) 
{ 
$("#lastnameLabel").text("lastname不能为空！") 
$("#lastnameLabel").css({"color":"red"}); 
isSuccess = 0; 
} 
if(isSuccess == 0) 
{ 
return false; 
} 
return true; 
} 
提交表单前进行验证(方法二) 
 











  first_name:    
  last_name:

formpage3.html

php简易企业网站源码,vscode打断点没反应,ubuntu运行efi,tomcat启动访问不到,c 爬虫源码,php 显示不了验证码,页内seo和页外s,算命大全网站源,365模板网lzw

 
Example3 
function jump() 
{ 
//清空表单所有数据 
document.getElementById("firstname").value="" 
document.getElementById("lastname").value="" 
$("#firstnameLabel").text("") 
$("#lastnameLabel").text("") 
} 
function checktosubmit(){ 
var txt_firstname = $.trim($("#firstname").attr("value")) 
var txt_lastname = $.trim($("#lastname").attr("value")) 
$("#firstnameLabel").text("") 
$("#lastnameLabel").text("") 
var isSuccess = 1; 
if(txt_firstname.length == 0) 
{ 
$("#firstnameLabel").text("firstname不能为空！") 
$("#firstnameLabel").css({"color":"red"}); 
isSuccess = 0; 
} 
if(txt_lastname.length == 0) 
{ 
$("#lastnameLabel").text("lastname不能为空！") 
$("#lastnameLabel").css({"color":"red"}); 
isSuccess = 0; 
} 
if(isSuccess == 1) 
{ 
form1.submit(); 
} 
} 
提交表单前进行验证(方法三) 
 











  first_name:    
  last_name:

以下是视图函数、URL配置以及相关设置
——————————————————————————–
——————————————————————————–
views.py

 
#coding: utf-8 
from django.http import HttpResponse 
from django.shortcuts import render_to_response 
def DealWithForm1(request): 
if request.method=="POST": 
FirstName=request.POST.get('firstname','') 
LastName=request.POST.get('lastname','') 
if FirstName and LastName: 
response=HttpResponse() 
response.write(""+FirstName+" "+LastName+u"！ 你提交了表单！") 
return response 
else: 
response=HttpResponse() 
response.write('alert("firstname或lastname不能为空！");\ 
window.location="/DealWithForm1"') 
return response 
else: 
return render_to_response('formpage1.html') 
def DealWithForm2(request): 
if request.method=="POST": 
FirstName=request.POST.get('firstname','').encode("utf-8") 
LastName=request.POST.get('lastname','').encode("utf-8") 
if FirstName and LastName: 
html=""+FirstName+" "+LastName+"！ 你提交了表单！"+"" 
return HttpResponse(html) 
else: 
response=HttpResponse() 
response.write('alert("firstname或lastname不能为空！");\ 
window.location="/DealWithForm2"') 
return response 
else: 
return render_to_response('formpage2.html') 
def DealWithForm3(request): 
if request.method=="POST": 
FirstName=request.POST.get('firstname','') 
LastName=request.POST.get('lastname','') 
if FirstName and LastName: 
response=HttpResponse() 
response.write(''+FirstName+LastName+u'！ 你提交了表单！') 
return response 
else: 
response=HttpResponse() 
response.write('alert("firstname或lastname不能为空！");\ 
window.location="/DealWithForm3"') 
return response 
else: 
return render_to_response('formpage3.html')

urls.py

 
from django.conf.urls.defaults import patterns, include, url 
import views 
from django.conf import settings 
urlpatterns = patterns('', 
url(r'^Resource/(?P.*)$','django.views.static.serve',{'document_root':settings.STATIC_RESOURCE}), 
url(r'^DealWithForm1','views.DealWithForm1'), 
url(r'^DealWithForm2','views.DealWithForm2'), 
url(r'^DealWithForm3','views.DealWithForm3'), 
)

settings.py

# Django settings for CheckFormBeforeSubmit project. 
import os 
HERE = os.path.abspath(os.path.dirname(__file__)) 
DEBUG = True 
TEMPLATE_DEBUG = DEBUG 
... 
STATIC_RESOURCE=os.path.join(HERE, "resource") 
... 
MIDDLEWARE_CLASSES = ( 
'django.middleware.common.CommonMiddleware', 
'django.contrib.sessions.middleware.SessionMiddleware', 
'django.middleware.csrf.CsrfViewMiddleware', 
'django.contrib.auth.middleware.AuthenticationMiddleware', 
'django.contrib.messages.middleware.MessageMiddleware', 
'django.middleware.csrf.CsrfResponseMiddleware', 
) 
ROOT_URLCONF = 'CheckFormBeforeSubmit.urls' 
TEMPLATE_DIRS = ( 
os.path.join(HERE,'template'), 
# Put strings here, like "/home/html/django_templates" or "C:/www/django/templates". 
# Always use forward slashes, even on Windows. 
# Don't forget to use absolute paths, not relative paths. 
) 
...