首页 > 解决方案 > 使用 JS 从 textarea 获取值并将其传递给服务器(jsp)而不需要重新加载页面

问题描述

我正在使用这段代码向我的 JSP 页面显示一个 TextArea,其中一个按钮在 onclick 事件之后调用两个函数。

<textarea id="textarea"></textarea>

<button style="float: right;" onclick="jQuery('#reDiv').load(' #reDiv'); doSth();">Get Text</button>

功能一:

<div id="reDiv"><%=new java.util.Date().toString()%></div>

功能二:

<script>
function doSth() {
var text = $("#textarea").val(); //value of textarea
<%=text%> //error
}
</script>

功能 1 工作正常。

在函数 2 中,我试图将刚刚从 TextArea 获得的值传递给我的服务器,而无需重新加载页面。我以后的目标是调用一个方法并在不刷新页面的情况下显示数据。

我知道错误是 JS 是客户端,而 JSP 是服务器端。但是我该如何解决呢?

标签: javascripthtmljsp

解决方案


在你的 jsp 中使用 scriptlet 是非常糟糕的做法(这些东西<% %>)。它被ELJSTL取代。

但是,是的,服务器在发送到客户端之前会在您的 jsp 页面中运行 java。并且在 java 已经执行之后,javascript 在客户端运行。最重要的是,您不能使用 scriptlet 直接访问 javascript 变量。但是,您可以反过来做,但在这种情况下它对您没有用处。

您提到您希望将值从您的 textarea 传递到您的服务器,而无需重新加载页面。这就是 AJAX 的用途。

<script>
function doSth() {
var text = $("#textarea").val(); //value of textarea
//<%=text%> //error
sendToServer(text);
}

function sendToServer(text){

  var params = {
      textarea: text
  };
  $.post("YourServletUrl", $.param(params), function(response) {
      // ... handle response here if you have any..
  });     

}
</script>

然后在您的 servlet 的 doPost 方法中,该方法具有您的 url 映射,YourServletUrl只需执行以下操作:

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException {

        String textarea= request.getParameter("textarea");

        System.out.println(textarea);

}

推荐阅读