美文网首页
关于博客前端项目的总结

关于博客前端项目的总结

作者: 啾啾哒 | 来源:发表于2017-08-24 16:07 被阅读0次

    跨浏览器获取滚动条位置

    function getScroll(){

    return{

    top:document.documentElement.scrollTop||document.body.scrollTop;

    }

    }

    //动画

    $("#test").click(function(){

    $(this).animate({

    attr:'left;,

    target:300

    });

    });

    引入Ajax

    可以使用交互更加流畅,更加人性化,局部刷新加载

    function Ajax(){

    var xhr=createXHR();

    obj.url=boj.url+

    }

    //调用ajax

    $(document).click(function(){

    ajax({

        method:'post',

        url:'demo.php',

        data:{

    'name':'Lee',

    'age':100

        }

    success:function(text){

    alert(text);

    },

    async:true

    });

    });

    });

    //php连接数据库 config.php

    <?php

    header('Content-type:text/html;charset='utf-8'');

    define('DB_HOST',localhost');

    define('DB_PWD','yangfan');

    define('DB_NAME','blog');

    $conn=@mysql_connect(DB_HOST,DB_USER,DB_PWD)or die(‘数据库链接失败:'.mysql_error()’);

    mysql-query(‘SET NAMES UTF8’).or

    mysql_query($query)or die('新增失败!' '.mysql_error());

    mysql_close();

    ?>

    add.php

    <?php

    require'config.php';

    $_birthday=$_POST['year'].'-'.$_POST['month'].'-'$_POST['day'];

    $query="INSERT INTO 

    <?php

    require 'config.php';

    $query=mysql_query("SELECT user FROM blog_user='{$_POST['user']}"")or die('SQL错误!')

    if(mysql_fetch_Array($query,MYSQL_ASSOC)){

    }

    mysql_close();

    ?>

    success:function(text){

    if(text==1){

    $("#reg .loading;).css('display','block');

    $('#reg .error_user’).html('用户名被占用');

    flag=false;

    }else{

    flag=true;

    }

    },

    async:fasle;

    });

    }


    //表单验证

    $("form").form('pass').bind('focus',function(){

    $('#reg .info_pass').css('display','block');

    $('#reg .error_pass').css('display','none');

    $('#reg .true_pass').css('display','none');

    }).bind('blur',function(){

    if(this($(this).value)=="")

    {

    $('#reg .info_pass').css('display','none');

    }else{

    if(check_pass(this){

    $('#reg .info_pass').css('display','none');

    $('#reg .error_pass').css('display','none');

    $('#reg .true_pass').css('display','block');

    }else{

    $('#reg .info_pass').css('display','none');

    $('#reg .error_pass').css('display','block');

    $('#reg .true_pass').css('display','none);

    }

    }

    }}

    //表单验证,密码强度验证

    $('form').form('pass').bind('focus',function(){

    check_pass(this);

    });

    function check_pass(this)

    {

      var flag=flase;

    var value=trim($(_this).value());

    //trim去除字符串两端的空白字符

    var value_length=value.length;

    var code_length=0;

    if(value.length>0&&!/\s/.test(value)){

    $('#reg .info_pass .q2').html('*').css('color','green');

    }else{

    $('#reg .info_pass .q2').html('0').css('color',#666');

    }

    if(value.length>=6&&value.length<=10)

    {

    $('#reg .info_pass .q2').html('*').css('color','green');

    }else{

    $('#reg .info_pass .q2').html('0').css('color',#666');

    }

    if(/[0-9]/.test(value)){

    code_length++;

    }

    if(/A-Z/.test(value)){

    code_length++;

    }

    }



    if (/[0-9]/.test(value)) {

    code_length++;

    }

    if (/[a-z]/.test(value)) {

    code_length++;

    }

    if (/[A-Z]/.test(value)) {

    code_length++;

    }

    if (/[^a-zA-Z0-9]/.test(value)) {

    code_length++;

    }

    if (code_length >= 2) {

    $('#reg .info_pass .q3').html('●').css('color', 'green');

    } else {

    $('#reg .info_pass .q3').html('○').css('color', '#666');

    }

    if (code_length >= 3 && value_length >= 10) {

    $('#reg .info_pass .s1').css('color', 'green');

    $('#reg .info_pass .s2').css('color', 'green');

    $('#reg .info_pass .s3').css('color', 'green');

    $('#reg .info_pass .s4').html('高').css('color', 'green');

    } else if (code_length >= 2 && value_length >= 8) {

    $('#reg .info_pass .s1').css('color', '#f60');

    $('#reg .info_pass .s2').css('color', '#f60');

    $('#reg .info_pass .s3').css('color', '#ccc');

    $('#reg .info_pass .s4').html('中').css('color', '#f60');

    } else if (code_length >= 1) {

    $('#reg .info_pass .s1').css('color', 'maroon');

    $('#reg .info_pass .s2').css('color', '#ccc');

    $('#reg .info_pass .s3').css('color', '#ccc');

    $('#reg .info_pass .s4').html('低').css('color', 'maroon');

    } else {

    $('#reg .info_pass .s1').css('color', '#ccc');

    $('#reg .info_pass .s2').css('color', '#ccc');

    $('#reg .info_pass .s3').css('color', '#ccc');

    $('#reg .info_pass .s4').html(' ').css('color', '#ccc');

    }

    if (value_length >= 6 && value_length <= 20 && code_length >= 2) flag = true;

    return flag;

    }


    相关文章

      网友评论

          本文标题:关于博客前端项目的总结

          本文链接:https://www.haomeiwen.com/subject/wygflxtx.html