`
anna_zr
  • 浏览: 200583 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

实现JSP数据和JavaScript数据交互使用

阅读更多

对于WEB程序来说,前端(JavaScript)和后端(JSP/Servlet)是没法共用数据的,只能是后端程序(JSP)把数据输出,生成页面到前端,这时候生成的页面中的JavaScript代码才有可能得到所谓jsp的数据。同样的,只有把JavaScript里的数据提交给后端JSP代码,JSP程序中才能得到JavaScript的数据。

那如何实现在页面的JavaScript中使用jsp中的数据或是在JSP中使用页面的JavaScript数据呢?

一、页面中的JavaScript的数据如何提交给后台的JSP程序

① 可以将JavaScript的数据以xxx.JSP?var1=aaa&var2=bbb的形式作为URL的参数传给JSP程序,此时在jsp中用


<%String strVar1=request.getParameter("var1");%>

就可以获取到JavaScript脚本传递过来的数据;

② 使用JavaScript通过在表单里加入隐藏域信息,然后用表单提交的方式把数据传递给JSP程序。

参考下面的脚本:


<script language="JavaScript">
<!--
/***************************************************************
* JavaScript脚本,放置在页面中的任何位置都可以
* insertclick()函数获取JSP传递到页面中的变量varMC,
* 然后就可以在JavaScript中修改这个变量的值,再通过
* post的方式提交给JSP程序来使用。
***************************************************************/
function insertclick(){
var1 = document.all.mc.value; //获取页面form中的变量值
var1 = var1 + "名称";
document.insertForm.submit();
}
//-->
</script>

<!-- html页面form表单,放置在html页面中的位置不限 -->
<form name="insertForm" method="post" action="yourJSP">
<!-- 下面这一句是获取JSP程序中传递过来的变量值 -->
<input type="hidden" name="mc" value="<%=varMC%>">
<input type="button" value="提交" onclick="insertclick()">
</form>

二、页面中的JavaScript的数据如何使用后台的JSP程序的数据

这个比较简单,直接在JavaScript脚本中用就可以把jsp程序中的数据传递给JavaScript脚本使用了。


参考下面的脚本:


<!-- html页面form表单,放置在html页面中的位置不限 -->
<form name="insertForm" method="post" action="yourJSP">
<input type="hidden" name="mc" value="">
</form>

<script language="JavaScript">
<!--
/***************************************************************
* JavaScript脚本,放置在页面中form以后的任何位置都可以
* 使用JavaScirpt获取JSP传递到页面中的变量varMC,
* 然后就可以在JavaScript中使用这个变量的值,通过
* JavaScript脚本赋值给form中的隐藏域。
***************************************************************/
var1 = "<%=varMC%>"; //获取JSP中的变量值
document.all.mc.value = var1;
//-->
</script>
分享到:
评论

相关推荐

    Android与JSP数据交互

    在IT行业中,Android和JSP的数据...通过这样的流程,Android应用就能与JSP后端实现数据交互,为用户提供动态更新的服务。在实际项目中,还需要考虑到错误处理、数据安全、性能优化等方面,确保应用的稳定性和用户体验。

    Jsp+Servlet+Echarts实现动态数据可视化

    本教程将聚焦于使用JSP、Servlet和ECharts技术来实现动态数据可视化的具体过程和知识点。 首先,JSP(JavaServer Pages)是Java平台上的一种动态网页技术,它允许开发者在HTML代码中嵌入Java代码,从而实现服务器端...

    JSP与JavaScript整合使用.pdf

    通过将JSP和JavaScript整合使用,可以将服务器端的数据传递给客户端,实现客户端的动态交互。 在实现JSP和JavaScript的整合时,需要将JSP生成的数据传递给JavaScript函数,然后由JavaScript函数在客户端执行,以...

    基于JavaScript的JSP页面数据导出Excel.pdf

    JavaScript可以通过EXT中间件进行数据交互,使用JsonReader将数据转换为JSON格式,并使用ActiveXObject创建Excel对象,实现数据的导出到Excel文件中。 知识点三:数据交互的实现 数据交互是指JSP页面数据导出Excel...

    JSP中使用JavaScript动态插入删除输入框实现代码.docx

    JSP中使用JavaScript动态插入删除输入框实现代码 JSP(Java Server Pages)是一种基于Java技术的服务器端脚本语言,主要用于生成动态网页内容。JavaScript则是一种客户端脚本语言,主要用于实现网页的交互功能。在...

    jsp实现,登录,插入,查询oracle数据可视化看板,数据区域实现隐藏滚动条,但有滚动效果,图表利用highcharts控件

    总的来说,这个项目是一个典型的前后端结合的应用,前端使用JSP和JavaScript提供用户界面和交互,后端借助Oracle数据库存储和处理数据,同时通过Highcharts实现数据的可视化展示。在实际开发过程中,还需要考虑安全...

    jQuery+json异步实现JSP和struts2之间的数据传递

    "jQuery+json异步实现JSP和struts2之间的数据传递"是一个典型的应用场景,它结合了前端JavaScript库jQuery与后端MVC框架Struts2,通过JSON这种轻量级的数据交换格式进行高效的数据交互。下面我们将详细探讨这一主题...

    利用ajax和jsp,JavaScript实现的注册系统

    以下是关于这个系统的一些关键知识点和实现细节: **Ajax(Asynchronous JavaScript and XML)**: Ajax是一种在不重新加载整个网页的情况下,更新部分网页的技术。它通过JavaScript与服务器进行异步数据交换,提高...

    ECharts前台后台数据交互Demo

    总结,ECharts与后台数据交互主要依赖于AJAX技术,通过前后端的协作,实现数据的动态加载和实时更新。这种方式极大地提高了用户体验,使数据可视化更加生动和实用。通过实践和不断优化,你可以构建出功能强大且互动...

    JSP.rar_javascript_javascript项目_jsp javascript_jsp小项目

    开发者需要了解如何在JSP中设置和使用JavaScript,以及如何处理请求和响应,实现数据的增删改查等操作。 6. **学习资源**:"JSP编程基础知识"文件很可能是为了帮助初学者快速入门JSP,包含JSP生命周期、指令、动作...

    jsp+mysql实现注册登录和管理员登陆实现增,删,改,查数据功能

    虽然描述中提到的是纯JSP实现,但实际项目可能还会涉及HTML、CSS和JavaScript,以创建美观的用户界面和提供更好的交互体验。 9. **MVC模式**: 虽未明确提及,但实现此类功能通常会采用Model-View-Controller...

    jsp+css+javascript

    **结合使用JSP、CSS和JavaScript** 在实际开发中,JSP通常负责处理服务器端逻辑,如数据处理和业务规则。CSS用于美化由JSP生成的HTML,提供网页的布局和视觉效果。JavaScript则负责增强用户体验,处理用户输入、动态...

    jsp和javascript写的无刷新聊天室及源代码

    这个聊天室示例对于初学者来说是一个很好的学习资源,可以帮助理解JSP和JavaScript如何协同工作来实现实时交互功能。同时,由于其功能相对简单,适合用来练习和掌握AJAX通信、动态更新页面以及服务器端数据处理等...

    Jsp用户管理系统JavaScript

    本项目是一个基于JSP的用户管理系统,利用JavaScript技术进行前端交互,结合MySql数据库来存储和管理用户数据。下面将详细讲解这个系统的关键技术和实现细节。 **JSP(JavaServer Pages)** JSP是Java的一个动态...

    Jsp树实现(无刷新交互).rar

    总的来说,"Jsp树实现(无刷新交互)"是一个典型的前后端交互示例,展示了如何利用JSP、JavaScript和Ajax技术优化用户界面的动态性和响应性。在实际开发中,这样的技术可以大大提高Web应用的性能和用户体验。

    JSP,JavaScript,Servlet等做的简单的Blog程序

    **JSP(JavaServer Pages)** 是一种...总的来说,这个基于JSP、JavaScript和Servlet的Blog程序提供了一个完整的博客平台,涵盖了用户交互、数据处理和存储的关键环节,是学习Web开发和实践Java EE技术的一个典型实例。

    用JavaScript实现远程教学中的动态交互功能.pdf

    使用JavaScript实现远程教学中的动态交互功能可以带来许多好处,如提高教学的互动性和趣味性、提高学生的参与度和兴趣度、减少教学成本和时间等。 本文介绍了一种基于JavaScript的静态页面处理技术,来实现远程教学...

    JSP实现树型结构TREE

    本例"JSP实现树型结构TREE"提供了一个使用JSP(JavaServer Pages)、EXTJS(一个前端JavaScript框架)、JSON(JavaScript Object Notation)以及MySQL数据库来创建树形结构的示例,这对于初学者或开发者来说,是一个...

    JSP+Javascript+Css帮助文档

    综合使用JSP、JavaScript和CSS,开发者可以构建出功能强大、交互丰富且视觉美观的Web应用。这份文档将深入讲解这三个领域的技术细节,帮助开发者提高技能,解决实际问题。无论是初学者还是经验丰富的专业人士,都能...

    JSP-Example.rar_javascript

    10. **JSON(JavaScript Object Notation)交互**:在JSP中发送和接收JSON数据,作为服务器和客户端之间的数据交换格式。 通过这些实例,学习者可以深入理解JSP和JavaScript如何结合,形成一个完整的Web应用程序。...

Global site tag (gtag.js) - Google Analytics