java - Javascript / jQuery 到 Servlet 通信

Question

我早些时候正在寻找这个，并且对我得到的答案有点困惑，所以我想为此编写一个完整的代码。这是为了我未来的工作，我希望有人能从中受益。

请看下面的答案。

Answer 1

这可以通过js和jquery来解决。但由于 jquery 更简单更短，所以我只是为此编写代码。在这种情况下，我将在 html / jsp 页面中更改选择时进行 ajax 调用

Jsp页面看起来像这样

<select class="target1">
   <option >Select type</option>
   <option >computer</option>
   <option >camera</option>
   <option >sound System</option>
   <option >battery</option>
</select>

<select class="target2">
    <option >Select type</option>
</select>

在从 target1 中选择时，我想在 target2 选择中显示另一个列表。为此，jquery 函数如下所示

$('.target1').change(function() {
    $.ajax({
        $('.target2').empty();
        url: 'http://localhost:8080/YourAppName/ServletName',
        data: {selectedValue: $(this).val()},
        success: function(response) {
            $('.target2').append(response);
        }
    });
});

在这里，我指向 target1 并在内部进行 ajax 调用。最初我将 target2 选择设为空。然后通过 调用servleturl并使用 传递值data。成功时，我只是将结果附加到 target2 选择中

在 ServletName（servlet）中，我编写了以下代码：

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


        String selectedItem = request.getParameter("selectedValue");


        productList = connDB.getProduct(query);

        response.setContentType("text/html;charset=UTF-8");
        PrintWriter out = response.getWriter();
        try {
            if(selectedItem == (Your Condition)){
                   out.println("<option >1</option>");
                   out.println("<option >2</option>");
                   out.println("<option >3</option>");
                   out.println("<option >4</option>");
            }else{}


        } finally {            
            out.close();
        }
    }

执行此代码后，您应该进入选择target2

1
2
3
4

正如您现在可以理解的那样，您可以随心所欲地对其进行自定义。