在jsp中访问javascript变量值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20747647/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
access javascript variable value in jsp
提问by D-Lef
I want to pass a javascript variable to my servlet, where I need to use it.
我想将一个 javascript 变量传递给我的 servlet，我需要在那里使用它。
In javascript, the variable countreturns the rows of my table and I can show countin the jsp, using $('#counter').html(count);, but I cannot pass count's value to my servlet. I tried document.getElementById("hiddenField").value=count;but it doesn't work.
在 javascript 中，变量count返回我的表的行，我可以在 jsp 中显示count，使用$('#counter').html(count);，但我无法将count的值传递给我的 servlet。我试过了，document.getElementById("hiddenField").value=count;但没有用。
Javascript
Javascript
<script>
var count = 3;
$(function() {
$('#counter').html(count);
$('#addButton').bind('click', function() {
count = document.getElementById("dataTable").getElementsByTagName("tr").length;
$('#counter').html(count);
});
$('#deleteButton').bind('click', function() {
count = document.getElementById("dataTable").getElementsByTagName("tr").length;
$('#counter').html(count);
});
});
document.getElementById("hiddenField").value=count; // ???
</script>
JSP
JSP
Count: <span id="counter"></span> <%-- it works --%>
<form method="post" action="newteamsubmit">
...
<input type="hidden" id="hiddenField" name ="countRows" />
<input type="submit" name ="button1" value=" Submit " />
<input type="submit" name = "button1" value=" Cancel " />
</form>
Servlet
小服务程序
String cr = request.getParameter("countRows"); //I' ve tried also to convert it
// to int, but that's not my problem, since I cannot pass the value as a start
I've spent many hours, trying to figure out how I can access a javascript variable in jsp, but I haven't found any solution. Thanks in advance.
我花了很多时间，试图弄清楚如何在 jsp 中访问 javascript 变量，但我还没有找到任何解决方案。提前致谢。
采纳答案by JB Nizet
The countis computed each time the add button or the delete button are clicked. But you only set the hidden field value once, when the page is loaded (and its value is thus hard-coded to 3).
在count每次添加按钮或删除按钮被点击的时间计算。但是您只在加载页面时设置隐藏字段值一次（因此它的值被硬编码为 3）。
You must set it, as you're doing for the #counterelement, in your click handlers:
您必须#counter在点击处理程序中设置它，就像您为元素所做的那样：
$('#addButton').bind('click', function() {
count = document.getElementById("dataTable").getElementsByTagName("tr").length;
$('#counter').html(count);
$('#hiddenField').val(count);
});
$('#deleteButton').bind('click', function() {
count = document.getElementById("dataTable").getElementsByTagName("tr").length;
$('#counter').html(count);
$('#hiddenField').val(count);
});
Also note that you're repeating exactly the same code in two click handlers here. You should do that only once, for the two buttons:
另请注意，您在此处的两个点击处理程序中重复了完全相同的代码。对于两个按钮，您应该只执行一次：
$('#addButton, #deleteButton').bind('click', function() {
count = document.getElementById("dataTable").getElementsByTagName("tr").length;
$('#counter').html(count);
$('#hiddenField').val(count);
});
or even, since you're using jQuery:
甚至，因为您使用的是 jQuery：
$('#addButton, #deleteButton').bind('click', function() {
count = $("#dataTable tr").length;
$('#counter').html(count);
$('#hiddenField').val(count);
});
回答by AbhinavRanjan
document.getElementById('hiddenField').value is not set because it is outside your document.ready. Put it inside your click handler.
document.getElementById('hiddenField').value 未设置，因为它在您的 document.ready 之外。把它放在你的点击处理程序中。
回答by Vivek Vermani
Make sure of 2 things -
确保两件事 -
- There is only one element with id "hiddenField" on your page.
- Make sure that the following code
- 您的页面上只有一个 id 为“hiddenField”的元素。
- 确保以下代码
document.getElementById("hiddenField").value=count;
document.getElementById("hiddenField").value=count;
is after in the page.
是在页面之后。
Just make sure that js sets the hiddenField after the element has been loaded. 3. check for any JS errors using Javascript console.
只需确保 js 在元素加载后设置 hiddenField 即可。3. 使用 Javascript 控制台检查任何 JS 错误。
Rest it looks good
休息看起来不错
回答by Canis
The main issue here is that you are trying to access from the server, a variable that only exists at the client. To access that variable you have to send it from the client to the server using AJAX to trigger some form of API in the backend. REST, SOAP or XML-RPC are common technologies used for this sort of thing. The server side code is used for generating the UI and providing it with data from a database or such. Commonly the UI is generated only once, and then the client calls the server asking for more data in response to user actions, like clicking a button.
这里的主要问题是您试图从服务器访问一个仅存在于客户端的变量。要访问该变量，您必须使用 AJAX 将其从客户端发送到服务器，以在后端触发某种形式的 API。REST、SOAP 或 XML-RPC 是用于此类事情的常用技术。服务器端代码用于生成 UI 并向其提供来自数据库等的数据。通常 UI 只生成一次，然后客户端调用服务器请求更多数据以响应用户操作，例如单击按钮。
Imagine a table filled with information about books: title, author, publish date etc. This table can get quite large, and traditionally this table will be split up over several pages and possibly a dynamic filter. To save bandwidth and increase the user experience by not loading the entire page from scratch you can use AJAX to ask the server for just the relevant data. Doing so the page updates dynamically and smoothly for the user.
想象一个包含书籍信息的表格：书名、作者、出版日期等。这个表格可能会变得非常大，传统上这个表格会被分成几页，可能还有一个动态过滤器。为了节省带宽并通过不从头加载整个页面来提高用户体验，您可以使用 AJAX 向服务器询问相关数据。这样做，页面会为用户动态且平稳地更新。
In your case, you can use this technique to update the server every time the user clicks the button.
在您的情况下，您可以使用此技术在用户每次单击按钮时更新服务器。
If however you are really just looking to update a hidden field in a form with a value as the user performs actions, and the server wont do anything with it except show it you can just use javascript.
但是，如果您真的只是想在用户执行操作时使用值更新表单中的隐藏字段，并且服务器不会对它做任何事情，除了显示它，您可以只使用 javascript。
Remember also that the request variable contains the data you post to the server when you submit the form. The servlet will get the data after the client has posted it, which is after the JSP has generated the page. The sequence of the code execution is JSP -> Javascript -> Servlet.
还请记住，请求变量包含您提交表单时发布到服务器的数据。servlet 将在客户端发布数据后获取数据，也就是在 JSP 生成页面之后。代码执行顺序为JSP -> Javascript -> Servlet。
Hope this helps!
希望这可以帮助！
回答by UVM
You can use this way:
你可以这样使用：
document.forms[0].countRows.value = counter
Hope this will help you
希望能帮到你
