• Jsp小结form js部分


     

    分析用到jsp部分的两种情况,一是用到form表单提交数据到jsp进行处理,一种是通过ajax传递数据到jsp进行处理返回数据。这里有几个常用的程序段,下面一一记录,方便以后使用。

    1、通过form表单提交数据:

    <form method="post" action="sql.jsp" onsubmit="return checklog">

    <input type="text" name="message" placeholder="请输入留言"/>

    <input type="text" name="username" placeholder="尊姓大名"/>

    <input type="hidden" name="act" value="insert"/>

    <button type="submit">提交</button>

    <!--<input type="submit" value="提交">-->

    </form>

     

    简述:其中method里面写的是传值方式,一共有两种,一个是get传值,一个是post传值,具体区别下次再总结;action是写提交到那个jsp表单进行处理,同一文件夹可以直接写,不同文件夹要写路径。onsubmit一般是客户端js进行判断后再上传,checklog是一个函数,用来进行检测验证。其中input的type为hidden是为了给后台传值是insert,从而jsp文件可以根据不同的表单传过来的值进行操纵数据库,是增删改查的哪一个。其中提交按钮用那种写法都可以,但要注意写上type类型。

     

    通过ajax提交数据form写法:

    <form>

    <input name="username" type="text" placeholder="请输入用户名">

    <button id="btn" type="button">提交</button>

    <span></span>

    </form>

     

    简述:这里因为是用js获取值通过ajax提交处理,所以form不需要action。其中的span是用来接受jsp返回数据的标签。

    2、js部分,第一种没有影响可以正常写,第二种会用到$.get|$.post|$.load传递数据

    因为html里面经常用到input并且都有name值,所以写的时候可以用name的方法获取input的value值。

    var username = $("*[name='username']").eq(0).val(); //获取vlaue值默认是获取第一个input的值,如果没有那么多就不用写索引值了。

     

        这是js内function的部分一个是注册验证函数fuction chekreg(){}一个是登录function checklog(){}和简单的的正则判断

    function checkreg() {

    var username = $("*[name='username']").eq(0).val(); //获取vlaue值

    var password = $("*[name='password']").eq(0).val();

    var repassword = $("*[name='repassword']").val();

    var phone = $("*[name='phone']").val(); //获取vlaue值

    var email = $("*[name='email']").val(); //获取vlaue值

    if (!username.match(/^[A-Za-z0-9]{3,15}$/)) {

    //每个汉字占3个字符

    alert("用户名格式错误,请重新输入");

    return flase;

    }

    if (password.length < 8) {

    alert("密码长度小于8位");

    return false;

    }

    if (password !== repassword) {

    alert("两次输入密码不一致");

    return false;

    }

    if (!phone.match(/^1[34578][0-9]{9}$/)) {

    alert("请输入正确的手机号");

    return false;

    }

    if (!email.match(/^[1-9][0-9]{4,10}@qq.com$/)) {

    alert("请输入qq邮箱");

    return false;

    }

    return true;

    }

    function checklog() {

    var username = $("*[name='username']").eq(1).val(); //获取vlaue值

    var password = $("*[name='password']").eq(1).val();

    if (!username.match(/^[A-Za-z0-9]{3,15}$/)) {

    //每个汉字占3个字符

    alert("用户名格式错误,请重新输入");

    return flase;

    }

    if (password.length < 8) {

    alert("密码长度小于8位");

    return false;

    }

    return true;

    }

        

    ajax的js写法

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

    var name = $("*[name='username']").val();

    var url ="ajax.jsp?username=" + name;

    $.get(url,function(data,status){

    $("span").html(data);

    });

    });

        

  • 相关阅读:
    JVM学习笔记之认识JDK(一)
    C#发送邮件异常:根据验证过程,远程证书无效
    windows下使用mysql双机热备功能
    批处理实现mysql的备份
    WebApi FormData+文件长传 异步+同步实现
    Oracle中已知字段名查询所在的表名
    mstsc遇到CredSSP加密Oracle修正
    使用subgit进行svn迁移至git(branch,tags)
    使用guava进行对字符串的加锁
    使用spring-data-solr做solr客户端
  • 原文地址:https://www.cnblogs.com/bonly-ge/p/7007683.html
Copyright © 2020-2023  润新知