JS实现页面跳转并传值

 更新时间:2022年06月16日 15:28:24   作者:失散多年的哥哥  
这篇文章主要为大家详细介绍了JS实现页面跳转并传值,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了JS实现页面跳转并传值的具体代码,供大家参考,具体内容如下

初次尝试js实现值的传输和调用,想做一个界面登录系统,通过js实现将输入的值传到另外一个jsp文件中,却被卡了挺久。
js的变量都是局部变量,网上众说纷纭,尝试了很多种依旧无法实现。

如图所示,读取账号密码的内容(如下)

html

<form  method="get" id="myForm">
         <div class="account clearfix">
           <span>账 号:</span>
           <input  type="text" id="nm" name="userName" />
         </div>
         <div class="password clearfix">
            <span>密 码:</span>
            <input  type="text" id="pw" name="password" />
         </div>
    
           <div class="btn">
              <span id="login"><a>登录</a></span>
              <span class="forget"><a href="password.html" >修改密码</a></span>
      </div>
</form>

JS

<script type="text/javascript">
            $(document).ready(function(){
                $('#login').on('click','a',function(){
                    var aVal = $('.identifire select');
                    if (aVal.val() == '学生') {
                        document.getElementById("myForm").action="stulogin.jsp";
                        document.getElementById("myForm").submit();
                    } else if (aVal.val() == '教师教辅人员'){
                        $(this).attr('href','TeacherIndex.html');
                    }
                });
            });
</script>

被输入的值存于userName和password中
在js中由下方实现

document.getElementById("myForm").action="stulogin.jsp";
document.getElementById("myForm").submit();

submit提交表单,页面在点击id=login的a标签后实现跳转
另一端jsp如下实现读取

String name1=request.getParameter("userName");
String password1=request.getParameter("password");

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • JavaScript的面向对象(二)

    JavaScript的面向对象(二)

    JavaScript的面向对象(二)...
    2006-11-11
  • 微信小程序+mqtt,esp8266温湿度读取的实现方法

    微信小程序+mqtt,esp8266温湿度读取的实现方法

    这篇文章主要介绍了微信小程序+mqtt,esp8266温湿度读取的实现方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-04-04
  • js查找节点的方法小结

    js查找节点的方法小结

    这篇文章主要介绍了js查找节点的方法,实例总结了查找节点常用的三种方法,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-01-01
  • Javascript的数组与字典用法与遍历对象的技巧

    Javascript的数组与字典用法与遍历对象的技巧

    Javascript 的数组Array,既是一个数组,也是一个字典(Dictionary)。先举例看看数组的用法
    2012-11-11
  • javascript特殊日历控件分享

    javascript特殊日历控件分享

    这篇文章主要为大家详细介绍了javascript特殊日历控件的使用方法,展示了javascript日历控件实现效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-03-03
  • ES6小技巧之代替lodash

    ES6小技巧之代替lodash

    这篇文章主要给大家介绍了关于ES6小技巧之代替lodash的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用ES6具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-06-06
  • 常用的9个JavaScript图表库详解

    常用的9个JavaScript图表库详解

    本篇文章给详细讲解了9个JavaScript图表库以及用法,需要的朋友参考学习下。
    2017-12-12
  • javascript如何创建对象

    javascript如何创建对象

    这篇文章主要为大家详细介绍了javascript创建对象的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • JavaScript 值类型和引用类型的初次研究(推荐)

    JavaScript 值类型和引用类型的初次研究(推荐)

    这篇文章主要介绍了JavaScript 值类型和引用类型的初次研究,需要的朋友可以参考下
    2017-07-07
  • JavaScript实现打地鼠小游戏

    JavaScript实现打地鼠小游戏

    这篇文章主要为大家详细介绍了JavaScript实现打地鼠小游戏的相关代码,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-05-05

最新评论