js实现点击按钮传值

  • page1源码：

      <!DOCTYPE html>
    
  <html>
    
  <head>
    
  <meta charset="UTF-8">
    
  <script>
    
  function newDoc() {
    
  window.location.assign("hellow.html")
    
  }
    
  function quzhi() {
    
  var text1 = document.getElementById("name").value; //取得文本框的值
    
  var text2 = document.getElementById("password").value;
    
  alert(text1);//网页提示框
    
  alert(text2);
    
  var myurl = "Test_01" + "?" + "pname=" + text1 + "&password=" + text2;
    
  window.location.assign(encodeURI(myurl))
    
  }
    
  function quzhi2() {
    
  var text1 = document.getElementById("name").value; //
    
  var text2 = document.getElementById("password").value;
    
  var myurl = "hellow.jsp" + "?" + "pname=" + text1 + "&password="+ text2;
    
  window.location.assign(encodeURI(myurl))
    
  }
    
  </script>
    
  </head>
    
  <body>
    
  <input type="text" id="name" value="joy">
    
  <input type="text" id="password" value="123456">
    
  <br />
    
  <br />
    
  <input type="button" value="加载新页面" onclick="newDoc()">
    
  <br />
    
  <br />
    
  <input type="button" value="取值" onclick="quzhi()">
    
  <br />
    
  <br />
    
  <input type="button" value="传值" onclick="quzhi2()">
    
  </body>
    
  </html>

  • page2源码：

      <!DOCTYPE html>
    
  <html>
    
  <head>
    
  <meta charset="UTF-8">
    
  <title>Insert title here</title>
    
  </head>
    
  <body topmargin="100" leftmargin="300">
    
  hellow  world!
    
  </body>
    
  </html>

  • page3源码:

      <%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
    
  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    
  <html>
    
  <head>
    
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    
  <title>Insert title here</title>
    
  </head>
    
  <body topmargin="100" leftmargin="300">
    
  <%
    
  String strName=request.getParameter("pname");
    
  String strPassword=request.getParameter("password");
    
  %>

  欢迎您！<%=strName %><br/>
    
  您的密码是：<%=strPassword %>
    
  </body>
    
  </html>

  • servlet源码:

      package test;

  import java.io.IOException;
    
  import javax.servlet.ServletException;
    
  import javax.servlet.annotation.WebServlet;
    
  import javax.servlet.http.HttpServlet;
    
  import javax.servlet.http.HttpServletRequest;
    
  import javax.servlet.http.HttpServletResponse;

  /**
    
  * Servlet implementation class Test_01
    
  */
    
  @WebServlet("/Test_01")
    
  public class Test_01 extends HttpServlet {
    
  private static final long serialVersionUID = 1L;

   /**
    
    * @see HttpServlet#HttpServlet()
    
    */
    
   public Test_01() {
    
  super();
    
  // TODO Auto-generated constructor stub
    
  }
    
  	/**
    
   * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
    
   */
    
  protected void doGet(HttpServletRequest request, HttpServletResponse 	response) throws ServletException, IOException {
    
  // TODO Auto-generated method stub
    
  response.getWriter().append("Served at: ").append(request.getContextPath());

  String strName=request.getParameter("pname");
    
  String strPassword=request.getParameter("password");

  System.out.println(strName);
    
  System.out.println(strPassword);

  }

  	/**
    
  	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
    
  	 */
    
  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    
  // TODO Auto-generated method stub
    
  doGet(request, response);
    
  }

  }

  • 运行后图片

js实现点击按钮传值的更多相关文章

  1. js实现点击按钮时显示弹框，点击按钮及弹框以外的区域时隐藏弹框

    转自https://blog.csdn.net/yimawujiang/article/details/86496936 问题:js实现点击按钮时显示弹框,点击按钮及弹框以外的区域时隐藏弹框? 方案一 ...

  2. 使用js实现点击按钮下载文件

    有时候我们在网页上需要增加一个下载按钮,让用户能够点击后下载页面上的资料,那么怎样才能实现功能呢?这里有两种方法: 现在需要在页面上添加一个下载按钮,点击按钮下载文件. 题外话,这个下载图标是引用的 ...

  3. 原生 js 实现点击按钮复制文本

    最近遇到一个需求,需要点击按钮,复制 <p> 标签中的文本到剪切板 之前做过复制输入框的内容,原以为差不多,结果发现根本行不通 尝试了各种办法,最后使了个障眼法,实现了下面的效果 一.原理 ...

  4. JS实现点击按钮，下载文件

    PS:本文说的,并非如何用js创建流.创建文件.实现下载功能. 而是说的:你已知一个下载文件的后端接口,前端如何请求该接口,实现点击按钮.下载文件到本地.(可以是zip啦.excel啦都是一样) 有两 ...

  5. 原生JS 实现点击按钮创建元素

    要求: 点击按钮,随机生成一个20px-100px宽度正方形,随机颜色,随机位置,不能出可视区域外 思路:(1)创建按钮,为按钮添加事件侦听 (2)触发事件,创建一个元素 (3)设置元素样式,包括大小 ...

  6. js实现点击按钮实现上一张下一张相册滚动效果

    /****判断图片是否构成滚动效果*/$(function(){    if($("#bar").find('img').size()*71<=$("#bar&qu ...

  7. js实现点击按钮弹出上传文件的窗口

    转自:https://www.jb51.net/article/100916.htm 1.详细描述 在页面上设置一个“选择文件”按钮,点击该按钮,会弹出本地磁盘信息用于选择文件. 2.代码 ? 1 2 ...

  8. 利用JS实现点击按钮后图片自动切换

    我么常常看到一个网站的主界面的图片可以切换自如,那么又是如何实现的呢? 1.HTML页面布局如图所示: Main(div) top(div)(显示需要显示的图片) bottom UL (li)< ...

  9. js实现点击按钮复制文本功能

    最近项目活动中用到复制文本功能,发现在chrome中之前的clipboard的demo失效了,查了下发现是因为版本升级导致的.最新用法如下: <!DOCTYPE html> <htm ...

随机推荐

  1. （转）使用openGL显示图像（一）建立OpenGL ES的环境

    编写:jdneo - 原文:http://developer.android.com/training/graphics/opengl/environment.html 要在应用中使用OpenGL E ...

  2. 2019牛客第八场多校 D_Distance 三维BIT或定期重建套路

    目录 题意: 分析: @(2019牛客暑期多校训练营(第八场)D_Distance) 题意: 在三维空间\((n\times m\times h\le 100000)\)内,有\(q(q\le 100 ...

  3. iOS 技能图谱

    # iOS 技能图谱## 编程语言 - Swift - Objective-C - C++/C - JavaScript ## 操作系统 - Mac OSX - iOS - watchOS - tvO ...

  4. day 62.3 Django基础八之cookie和session

    Django基础八之cookie和session   本节目录 一 会话跟踪 二 cookie 三 django中操作cookie 四 session 五 django中操作session 六 xxx ...

  5. 【React】react&&redux调试工具

    一.React调试工具 1.安装 react-developer-tools,在chrome应用商店进行下载,因为网络限制原因,我们可以使用火狐浏览器进行安装下载 a.打开火狐浏览器的附加组件 b.搜 ...

  6. shell-#！

    当shell执行一个程序时,会要求UNIX内核启动一个新的进程,以便在该进程里执行所指定的程序. 当系统只有一个shell时,退回到/bin/sh 的机制非常方便,但现行的UNIX系统都会拥有好几个s ...

  7. USACO 2014 US Open Odometer /// 枚举

    题目大意: 给定区间 l r 求区间包含多少个数 它们各个位的数只有一个不一样 注意 多个位但多个数为0单个数为x的情况 这种情况只有 x000 即把单个数放在首位才是正确的 同样注意 多个位但单个数 ...

  8. Error (10170): Verilog HDL syntax error at passwd.v(21) near text "if"; expecting an identifier ("if" is a reserved keyword ), or "endmodule", or a parallel statement

    你得加上时序啊笨蛋

  9. 聊聊redis实际运用及骚操作

    前言 聊起 redis 咱们大部分后端猿应该都不陌生,或多或少都用过.甚至大部分前端猿都知道. 数据结构: string. hash. list. set (无序集合). setsorted(有序集合 ...

  10. java全栈商业小程序开发

    此次开发只为学习和巩固,第一次学习开发 一.开发前需要了解: 开发框架MVVM.痛点.开源工具.VUE前端框架.微信支付模块.uni-app前端框架.小程序申请.开发工具下载.编写测试小程序.小程序结 ...