而web开发,个人觉得未免说得太宽范了点,一般主要指后台的程序开发方面,会用到PHP或ASP,mysql或mssql,ajax等,主要是服务器端的脚本语言及数据库技术,这也是网站保证正常动作,技术方面最核心的部分。
//H5自带的验证是比较简单的验证,不完美,只适合比较简单的验证。具体使用方法如下://需求:用户名:不能为空,长度在6至12之间,内容为英文
//HTML
<input type="text" id="user" required minlength=6 maxlength=12 pattern="^[a-zA-Z]+$">
//js
var user = document.getElementById("user")
user.onblur = function(){
if(user.validity.valueMissing){
user.setCustomValidity("用户名为空.")
}else if(user.validity.tooShort){
user.setCustomValidity("用户名过短.")
}else if(user.validity.tooLong){
user.setCustomValidity("用户名过长.")
}else if(user.validity.patternMismatch){
user.setCustomValidity("用户名输入错误.")
}
}
//required属性:验证是否为空
//pattern属性 :匹配正则
//validity属性:是H5底层的逻辑提供,原本已经存在的。元素通过elem.validity获得validityState对象
//例如可以获得的对象有:valueMissing 验证是否为空 返回true或false
//再例如:patternMismatch 验证是否匹配正则 同样返回 true或false
怎么使用ajax提交?
你可以将我上面的代码封装成一个check方法,用来检查表单内容是否正确,在用户点击提交按钮的时候不是直接submit表单,而是触发一个表单提交前验证方法check,验证通过后,将表单中的元素获取到,保存在一个变量中下面以jquery的ajax为例:
var jsonData={'userName':user.value}
$.ajax({
url:'接口地址',
type:'post',
dataType:'json',
data:jsonData,
success:function(data){
//发送成功后的回调,data包含成功时后台返回的数据
},
error:function(res){
//发送失败时的回调,res包含失败时的后台返回的数据
}
})
//特别要注意一点的是如果要用ajax发送数据,就不要将提交按钮的type设置为submit,否则form还是会自动提交