方法如下:
创新互联建站一直通过网站建设和网站营销帮助企业获得更多客户资源。 以"深度挖掘,量身打造,注重实效"的一站式服务,以成都网站建设、成都网站设计、移动互联产品、网络营销推广服务为核心业务。10年网站制作的经验,使用新网站建设技术,全新开发出的标准网站,不但价格便宜而且实用、灵活,特别适合中小公司网站制作。网站管理系统简单易用,维护方便,您可以完全操作网站资料,是中小公司快速网站建设的选择。
打开myeclipse,选择windows--perferences--spket--javaScript Profiles,如下图:
在右边点击new按钮,进行新建,输入名称jquery,然后点击确定,如下图
然后选中jquery,点击右侧的”Add Library“按钮,选择”jQuery“
在选中”jQuery“,然后点击右侧的"Add File"按钮,选择之前下载的jquery.js
然后选中jquery,点击右侧的default按钮,如下图
找到General--Editors--File Accociations,然后将右侧的js,关联到Spket JavaScript Editor,将此编辑器设置为默认。如下图
最终在myeclipse新建js文件,打开后,在里面写入jquery代码,出现自动提示,如下图:
1、给输入名字的文本框绑定一个失去焦点事件,jquery中为focusout事件,同时在文本框后定义一个显示检查结果的span。
2、当文本框失去焦点时,调用ajax异步向后台发送请求。
3、将请求结果显示在文本框后面提示用户,避免所有信息填写完毕表单提交时才发现名字重复。
示例:
input type='text' id='name'/span id='errorMsg'/erorMsg
//给文本框绑定一个失去焦点事件
$("#name").focusout(function() {
var name = $("#name").val();
if(name != null name != ''){
checkName(name);
}
});
//发ajax请求到后台判断用户名是否重复
function checkName(name){
$.ajax({
url : servletUrl,
type : "post",
dataType : 'JSON',
data : {name:name},
success : function(result) {
//已经存在该名字提示用户
if(result == true){
$("#errorMsg").html("该用户名已经存在");
}else{
$("#errorMsg").html("恭喜您,用户名可以使用");
}
}
},
error : function() {
alert('检查用户是否存在发生错误');
}
});
}
JQuery的弹出提示框可以有两种方式
Alert 方式以及 Confirm 方式弹出
Alert方式的弹出提示框,只能有一种抉择,那就是确定,他这是一种不可选择的提示
Confirm方式,是带有选择功能的提示框,用户可以点击确定或者取消
$('#regForm').validate({
rules:{
cellphone:{
required:true,
mobilephone:true,
remote:'/index/check-username'
},
verify:{
required:true,
remote:'/index/check-verifycode'
},
password:{
required:true,
minlength:6,
maxlength:20
},
confirmPassword:{
required:true,
minlength:6,
maxlength:20,
equalTo: "#password"
},
smgverifycode:{
required:true
},
/*inviteCode:{
maxlength:5,
minlength:5,
remote:"/index/check-invite-code"
},*/
agreement:{
required:true
}
},
messages:{
cellphone:{
required:addstyle('请输入手机号码'),
mobilephone:addstyle('不是有效的手机号'),
remote:addstyle('手机号码已经被注册')
},
verify:{
required:addstyle('请输入图文码'),
remote:addstyle('图文码不正确')
},
smgverifycode:{
required:addstyle('请输入短信验证码')
},
password:{
required:addstyle('请输入密码'),
minlength:addstyle("密码应该为6-20位"),
maxlength:addstyle("密码应该为6-20位")
},
confirmPassword:{
required:addstyle('请再一次输入密码'),
minlength:addstyle("密码应该为6-20位"),
maxlength:addstyle("密码应该为6-20位"),
equalTo:addstyle('您输入的确认密码和密码不一致')
},
/*inviteCode:{
maxlength: addstyle('邀请码不正确'),
minlength: addstyle('邀请码不正确'),
remote:addstyle('邀请码不存在')
},*/
agreement:{
required:addstyle('请同意供货商入驻协议')
}
},
errorElement:'p',
errorClass:'err_p',
errorPlacement:function(error, element){
if (e.html() == "" error[0].textContent != "") {
error.appendTo(e.show());
}
},
//success:function(label,element){
// console.log(2, label, element);
// label.parent().parent().siblings('div').removeClass('control-group err');
// if(label.text() == ''){
// label.parent().css('display','none');
// label.remove();
// }
//},
highlight: function (element) { // hightlight error input
if (e.find('p').attr('for') == 'smgverifycodeoften') {
e.html('').hide();
}
if (e.text() == "" || e.find('p').attr('for') == $(element).attr('id') ) {
$(element).parent().addClass('control-group err');
}
},
unhighlight: function (element) { // revert the change done by hightlight
var label = $("span.err_msg");
$(element).parent().removeClass('control-group err');
if(label.text() == '' e.text() == ""){
e.hide();
}
},
submitHandler:function(form){
s.addClass('alert-info').html('span注册中...请稍后/span').show();
$.post("/index/post-register", $(form).serialize(), function(res){
if(res.code){
$.cookie('username', $('input[name="cellphone"]').val(), {expires:30});
s.html('span注册成功, 跳转至登录页.../span').show();
setTimeout(function(){
window.location = '/index/login';
}, 800);
} else {
s.hide(); //隐藏正确提示
/*if (res.data.reason == 1) {
$('#invite_code').parent().addClass('control-group err');
e.html('p for="invite_code" class="err_p"span class="err_msg"'+res.msg+'/span/p').show();//显示错误信息
$(".err_p").show();
}*/
if (res.data.reason == 2) {
$('#smgverifycode').parent().addClass('control-group err');
e.show().html('p for="smgverifycode" class="err_p"span class="err_msg"'+res.msg+'/span/p');//显示错误信息息
$(".err_p").show();
} else {
$('#smgverifycode').parent().addClass('control-group err');
e.show().html('p for="smgverifycode" class="err_p"span class="err_msg"'+res.msg+'/span/p');//显示错误信息息
$(".err_p").show();
}
setTimeout(function() {
e.hide().html('')
}, 2000);
}
},'json');
}
});
});
名称栏目:jquery提示信息,jQuery提示信息
转载来源:https://www.cdcxhl.com/article42/dsdsghc.html
成都网站建设公司_创新互联,为您提供软件开发、建站公司、用户体验、静态网站、品牌网站设计、标签优化
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联