如何在单个按钮单击或事件上执行两个任务

How to perform two tasks on a single button click or event

本文关键字：执行 任务 两个 事件 单个 按钮 单击      更新时间：2023-09-26

我有一个按钮点击它，它通过调用函数incrementIndex增加计数值。但我也想添加一个字符串到同一事件的数组列表。下面提供了一个简单的代码片段。

<

Java脚本/strong> 

var count=0;
function incrementIndex() {
count += 1;
}

ArrayList 

<%
ArrayList arr= new ArrayList();
String ele="3,2";
%>

按钮: 

<button onclick="incrementIndex()">Button 1</button>

要让一个按钮点击调用另外两个任务(或其他)，只需将其他任务嵌套到绑定到onclick的函数

所以不是:

<button onclick="incrementIndex()">Button 1</button>

你将有

<button onclick="increment_and_add_string()">Button 1</button>

那么你需要有这个代码

function increment_and_add_string(){
     incrementIndex();  //this will call the increment function
     arr.add(ele);  //this will call the method add to arr passing it ele.
}

显然，您将有一些范围界定问题，如果没有更深入地了解您从哪里获得arr和ele，我无法在这方面帮助您。但要点是，您调用了一个执行若干任务的函数，并将其绑定到按钮单击事件。

在递增函数的末尾调用string函数

$(function(){
   $(#button").click(function(){
  incrementIndex();  //this will call the increment function
 arr.add(ele);  //this will call the method add to arr passing it ele.
});
 });

或者类似

的东西
$(function(){
   $(#button").click(function(){
   $("#").increment();//what ever your incrementing function is
   $.get("ServerResponce.asp"), function( data ) { // call controller or server action
   $( ".result" ).html( data );
});
});
});

可以有一个运行所有其他函数的handler函数。

<button onclick="handleButton1Click()">Button 1</button>
<script>
var count = 0,
    stringList = [];
function incrementIndex() {
  count += 1;
}
function addString(string) {
  stringList.push(string)
}
function handleButton1Click(e) {
  addString(e.someEventProperty);
  incrementIndex();
}
</script>

You have to first understand how jsp is presented to the user in browser. Whatever is shown to the user in the browser is just html and javascript, having said this whatever java code you  have written in jsp is compiled and processed in JVM itself thus no java variable will be available to the end user in browser for further updation, on the contrary javascript runs in browser so you can do whatever you want with the help of javasscript in browser. 
Now coming to your problem, you have a List in java so its reference won't be available to you in browser so what you can do is you can have a javascript list and assign the java List to it. Now you will have an access to javascript list in the browser, do whatever you want to do with it as add/substract/concat etc and while submitting form, submit the value of that javascript list too in some hidden field and finally in your servlet/controller class you will have latest list using which prepare final updated java List.
Let say you java list is as below:
 <%
    List<Object> javaObjList = new ArrayList<Object>();
 %>
In your jsp assign it to java script variable as below
<script>
 var jsObjList = <%= javaObjList.toArrays()%>
</script>
Have some hidden field in you form as below:
<input type="hidden" name="finalList" id="finalListId"/>
Before form submission call a function which will do as follow:
<script>
function preSubmissionProcessing() {
   document.getElementById("finalListId").val = jsObjList; 
   // make sure jsObjList  is in scope so that accessible to this method
}
</script>
That's it
相关文章：