gpt4 book ai didi

java - 从 javascript 调用 java 方法

转载 作者:行者123 更新时间:2023-12-01 14:35:51 25 4
gpt4 key购买 nike

我有一个 web jsp web 应用程序。在一页中我需要两个下拉列表。当我从 dd1 中选择一个值时,第二个下拉列表将根据该值填充。如何从 javascript 或 jQuery 中的下拉菜单 1 更改事件调用 java 函数?

我得到了示例,但那是调用 jsp 页面,但我需要 java 方法并发送我从 dropdown1 获得的参数

这是我的下拉菜单 dd1。所以如果我选择tom,我必须在dd2中获取tom的相关信息。

            <td>
<select id="dd1">
<option value="1">john</option>
<option value="2">Tom</option>
</select>

</td>
</tr>
<tr>
<th> Projects </th>
<td>

<select id="dd2">
<option value="1">pp1</option>
<option value="2">pp2</option>
</select>

</td>

我有以下代码

$(function () {
var ddVal = '';
var dropdown = document.getElementById("dd1")
$(dropdown).focus(function () {
ddVal = $(this).val();
}).blur(function () {
if (ddVal == $(this).val()) {
$(this).change();
}
}).change (function () {

});

用于 dd1 的更改事件。但我不知道如何从 jQuery 调用 java 方法。

在我的应用程序中,我有一个 java 类,其中有一个方法返回我需要在 dd2 下拉列表中加载的列表。

有人可以帮我解决这个问题吗?

最佳答案

你应该使用 AJAX 来做这样的事情。

JavaScript 发送请求,您的 Controller 利用 Java 部分执行所需的操作,然后传回 JSON 响应,您的 JavaScript 根据该响应来操作页面。

<小时/> 编辑:

例如,脚本可以发出以下请求:

$.ajax({
"type": "POST",
"url": "/ajaxAPI/updatedropdown/",
"data": {
"selected": selectedMenuItemId
},
"success": function (data) {
var menuItems = data.menuItems;
dropDownToChange.updateChoices(menuItems);
}
});

此类请求的 Controller 可能如下所示:

public class DropDownListController implements Controller {

@Override
public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
MenuItem selected = extractSelectionFromRequest(request);
List<MenuItem> choices = dropDownListService.getMenuFor(selected);
ModelAndView mav = new ModelAndView("dropDownListAjax.jsp");
mav.addObject("menu", choices);
}

// WARNING! Some error checks are missing!
private MenuItem extractSelectionFromRequeset(HttpServletRequest request) {
validateRequest(request);
return dropDownListService.getMenuItemById(request.getAttribute("selected"));
}

// ...

}

对于 View ,你可以有类似的东西:

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
{
"menuItems": [
<c:forEach items="${menu}" var="menuItem">
{
"url": <c:out value="${menuItem['url']}"/>,
"caption": <c:out value="${menuItem['caption']}"/>
},
</c:forEach>
]
}

客户端 JavaScript 将收到如下响应:

{
"menuItems": [
{
"url": "http://www.example.com/"
"caption": "Home"
},
{
"url": "http://www.example.com/news/list/"
"caption": "News"
},
{
"url": "http://www.example.com/forum/topics/"
"caption": "Forum"
},
]
}

请注意,上面的示例可能不是 100% 正确,因为自从我上次使用 JSP 以来已经有一段时间了(无论如何,我对 FreeMarker 更满意)。

基本上,您调用 Web 基础设施的一部分,而不是使用 HTML 代码进行响应,而是根据请求操作的结果传回 JavaScript 对象。

由于 jQuery 位于客户端而 JSP 位于服务器端,因此您无法选择直接调用远程方法。在 Web 世界中执行此操作的标准方法是 AJAX。

关于java - 从 javascript 调用 java 方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16494787/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com