笔记-ajax创建弹出层-修改手机

/** *点击查询时调用的Ajax */function push(){if(!tochecke()) return false;var userId = $('#userId').val();var tel = $('#userTel').val();$.ajax({                 type:"post",                 dataType:"html",                 url:"url",            async:false,            cache:false,            timeout:80000,     //ajax请求超时时间80秒                 data:{            Id : Id            }, //40秒后无论结果服务器都返回数据                 success:function(data){ //从服务器得到数据，显示数据并继续查询                      closeTel() alert(data);            },                error:function(data){ //Ajax请求超时，继续查询                 closeTel(); alert("链接有误，请查看网络链接");         }             });} /** * 修改手机号-start  * @param {Object} userId */ function updateTelShow(userId){$.ajax({url:"url",type:"post",dataType:"html",data:{id:id},async: false,success:function(data){$('body').append(data);creatediv();$("body").css({overflow:"hidden"}); $('#updateTel').css({top:ScrollTop()+100,left:ScrollLeft()+200});//初始化绑定手机输入框telBind();}});}/** * 验证手机号唯一 */function tochecke(){var tel = $('#userTel').val();if('' == $.trim(tel) || '手机号' == tel){alert("手机号不能为空!");$("#userTel").focus(); return false;}if(!tel.match(/^1[3|4|5|8][0-9]\d{4,8}$/)){alert("手机号码格式不正确!");$("#userTel").focus(); return false;}return true;}/** * 绑定手机号  */function telBind(){//手机号输入框绑定$("#userTel").bind({click : function(){var tel = $('#userTel').val();  if('手机号' == tel){$('#userTel').val('');$('#userTel').focus();}},blur : function(){var tel = $('#userTel').val();if('' == $.trim(tel)){$('#userTel').focus();$('#userTel').val('手机号');}},keydown : function (e) {  //只能输入数字var code = (e.keyCode ? e.keyCode : e.which);        if (code >= 96 && code <= 105 || code >= 48 && code <= 57 || code == 8 || code==110 || code==190) {              return true;          } else {          alert("只能输入数字");$('#userTel').focus();$('#userTel').val('手机号');            return false;          }      }});}/** * 创建动态div锁闭屏幕 */var creatediv = function(){    var parentdiv = $('<div></div>');    parentdiv.attr('id', 'parent'); //给div设置id    parentdiv.css({   'position':'absolute',　   'left':'0',   'top':'0',   'width':$(document).width(),   'height':$(document).height(),   'background-color':'#DBDBDB',   'filter':'alpha(opacity=20)',   'z-index': '10',   'opacity': '0.5'  }); //添加css样式    $('body').append(parentdiv);//将父div添加到body中}/** * 关闭按钮和取消 */function closeTel(){$('#updateTel').remove();$('#parent').remove();$("body").css({overflow:''}); }/** * 滚动条向下滚动 */var ScrollTop = function() {    if ('pageYOffset' in window) {        return window.pageYOffset;    } else if (document.compatMode === "BackCompat") {        return document.body.scrollTop;    } else {        return document.documentElement.scrollTop;    }}/** * 滚动条向右滚动 */var ScrollLeft = function() {    if ('pageXOffset' in window) {        return window.pageXOffset;    } else if (document.compatMode === "BackCompat") {        return document.body.scrollLeft;    } else {        return document.documentElement.scrollLeft;    }}

对应的css

/*-------------修改手机号----------------*/.join_fadeout{ width:335px; padding-bottom:15px;  overflow:hidden; border:4px solid #ddd; background:#fff; position:absolute; top:15%; left:39%; z-index:11;}/* 浮动定义 */.fl{ float:left;}.fr{ float:right;}.fm{ margin:0 auto;}.title_back {    background: none repeat scroll 0 0 #F3F3F3;    color: #595959;    font-size: 14px;    height: 30px;    line-height: 30px;    padding: 0 0 0 20px;    vertical-align: middle;}.W_close,.W_true{ line-height:23px;}.W_close {    background:url(/nacecsns/resource/images/web/microGroup/all_r_btn.gif);color:#595959;    cursor: pointer;    display: block;    height: 22px;    line-height:16px;    width: 60px;border:1px solid #ddd;border-radius:5px;}.W_true {    background:url(/nacecsns/resource/images/web/microGroup/join_green_btn.gif) repeat-x;color:#FFF;    cursor: pointer;    display: block;    height: 22px;    line-height:16px;    width: 60px;border:1px solid #4ec000;border-radius:5px;}.W_bianju{margin-left:15px;}.join_main{ padding-top:10px;overflow:hidden;}.join_main strong{ font-size:24px; font-family:Georgia, "Times New Roman", Times, serif}.join_main span{ display:block;}.join_main,.join_input_m{width:300px; display:block;}.join_main_code{ padding:8px 5px 0 0;}.join_main_textarea{ width:300px; border:1px solid #ddd;}.join_input_text{ width:104px; height:24px; border:1px solid #ddd;}.join_input_text_answer{ width:300px; height:24px; border:1px solid #ddd;}.join_close_btn{ width:8px; height:8px; background:url(/nacecsns/resource/images/web/microGroup/join_close_btn.gif) no-repeat; border:none; margin:10px;}