获得没有提交表单的输入值

时间:2013-11-13 09:20:03

标签: javascript jquery jsp post

我需要让我的jsp页面无需使用jquery重新加载页面。

$(".btn.btn-default.btn-lg").click(function( event ) {
    event.preventDefault();
    $.post(main.jsp,{operand1: request.getParameter("operand1")});
    alert(<%= request.getParameter("operand1") %>);
});

我正在尝试将参数发布到页面并提醒它。什么都没发生。 但功能正常。 我的错是什么?

这是完整的jsp代码。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap.min.css" rel="stylesheet">
<title>Insert title here</title>
</head>
<body>
<script src="https://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<form class="form-horizontal" role="form" method="get">
 <div class="form-group">
 <div class="col-lg-10">
<input name="operand1" id="operand1" class="values"></input>
<input name="operand2" id="operand2" class="values"></input>
</div>
</div>
 <div class="form-group">
<div class="col-lg-10">
<select name="operation" id="operation" class="values">
<option value="plus">+</option>
<option value="minus">-</option>
<option value="multiply">*</option>
<option value="divide">/</option>
<option value="mod">mod</option>
</select>
</div>
</div>
 <div class="form-group">
 <div class="col-lg-10">
<input type="submit" class="btn btn-default btn-lg" value="Submit"></input>
</div>
</div>
</form>
<script>
$(".btn.btn-default.btn-lg").click(function( event ) {
    event.preventDefault();
    $.ajax({
        method:"POST",
        url: "main.jsp",
        data: {operand1: document.getElementById("operand1").value, operand2: document.getElementById("operand2").value, operation: document.getElementById("operation")}
    }).done(function (result) {
              alert(result);
    });
    alert($('input.values').val());
});
</script>
<%
Double operand1=0.0;
Double operand2=0.0;
String operation=new String();
if ((request.getParameter("operand1")!=null)&&(request.getParameter("operand2")!=null)&&(request.getParameter("operation")!=null)){
    operand1 = Double.parseDouble(request.getParameter("operand1"));
    operand2 = Double.parseDouble(request.getParameter("operand2"));
    operation=request.getParameter("operation");
}
Double result=0.0;
if (operation.equals("plus")){
    result=operand1+operand2;
}
if (operation.equals("minus")){
    result=operand1-operand2;
}
if (operation.equals("divide")){
    result=operand1/operand2;
}
if (operation.equals("multiply")){
    result=operand1*operand2;
}
if (operation.equals("mod")){
    result=operand1%operand2;
}
if ((request.getParameter("operand1")!=null)&&(request.getParameter("operand2")!=null)&&(request.getParameter("operation")!=null)){
    String resultString="Result:";
    out.println(resultString+result);
}
%>
</body>
</html>

有什么建议吗?

3 个答案:

答案 0 :(得分:0)

你应该使用像这样的ajax:

$(".btn.btn-default.btn-lg").click(function( event ) {
    $.ajax({
        method:"POST",
        url: "main.jsp",
        data: {operand1: document.getElementById("operand1").value}
    }).done(function (result) {
              alert(result)
    });
});

答案 1 :(得分:0)

request是一个JSP隐式对象,在javascript中不起作用。相反,您可以使用以下来获取值。

$('#operand1').val(); //operand1 is an id of the element

答案 2 :(得分:0)

使用成功回调:

$(".btn.btn-default.btn-lg").click(function( event ) 
{
    $.ajax(
    {
        method:"POST",
        url: "main.jsp",
        data: {operand1: document.getElementById("operand1").value},
        success: function(result) 
        {
            alert(result); 
        }
    })
});