该程序无法显示jquery

时间:2014-12-17 06:28:36

标签: javascript jquery html jsp

我已经使用jquery编写了一个代码,只需点击一个按钮就可以在输入文本框的下方显示输出,我有2个要显示的内容...一个是平方根,另一个是简单的数据库查询,但我可以一次只显示1个

enter image description here

test4.jsp

 <script src="//malsup.github.com/jquery.form.js"></script>
 <script type="text/javascript">
 $(function(){
        $("#hide").click(function()
          {
            $('#number').fadeOut(2500); //prop('disabled', false);
          });
        $("#enable").click(function()
          {
            $('#number').prop('disabled', false);
          });
          $("#show").click(function()
          {
            $('#number').show(2500,function()
          {
            alert("u can enter the values now");
          });
          });
        });     // enable ..show ..hide 

       $(document).ready(function() 
        {
        $('#form').submit(function() {

    var number = $('#number').val();

    $.ajax({
        type:       "post",
        url:        "test5.jsp",
        data:       "number=" + number,
        success:    
                   function(msg) 
                    {
                          //$('#result').hide();
                          //$("#result").html("<h3>" + msg + "</h3>").fadeIn("slow");
                          $("#result2").html("<h3>" + msg + "</h3>").fadeIn("slow");
        }
    });
return false;
});
});
    </script>
</head> 
<body>
<form id="form" action="" method="post">
Enter number:
    <input id="number" type="text" name="numb" disabled/>
    <input id="enable" type="button" value="Enable">
    <input id="show" type="button" value="show">
     <input id="hide" type="button" value="hide">
<input id="submit" type="submit" value="Calculate Square Root" name="submit"/>
</form>
<p id="result"></p>
<p id="result2"></p>

test5.jsp代码

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page language="java" import="java.sql.* ,java.util.*, javax.servlet.*,javax.servlet.http.*,          abc.database"%>

<%
int numb = 0;
if(request.getParameter("number").matches("9"))
   //if (request.getParameter("number").value 
{
numb = Integer.parseInt(request.getParameter("number"));
out.println("Square root of " + numb + " is " + Math.sqrt(numb));
} 
else {
out.println("Enter a number!");
}  
%>

<%
            Connection conn = null ;  
            ResultSet rs = null;
            PreparedStatement ps = null ;
 %>
<%               
            database obj =new database();
            conn = obj.connect(); 
     ps = conn.prepareStatement("select field2 from test4 where field1 = "+numb+"");
            rs = ps.executeQuery();

        while(rs.next())
            {
            String x = rs.getString(1);
            out.println("the value is "+x);
         }  
        conn.close();     rs.close();         
%>

注 - &gt;我已经测试了..数据库连接工作正常..实际上只有其中一个可以工作,或者它给DB o / p或平方根

1 个答案:

答案 0 :(得分:1)

注意:根据您当前提供的代码,只有在number ='9'

时才会打印sqr根目录
if(request.getParameter("number").matches("9"))

如果你不介意在servlet回复中加入一些html格式,请试试这个:

 <script src="//malsup.github.com/jquery.form.js"></script>
 <script type="text/javascript">
 $(function(){
        $("#hide").click(function()
          {
            $('#number').fadeOut(2500); //prop('disabled', false);
          });
        $("#enable").click(function()
          {
            $('#number').prop('disabled', false);
          });
          $("#show").click(function()
          {
            $('#number').show(2500,function()
          {
            alert("u can enter the values now");
          });
          });
        });     // enable ..show ..hide 

       $(document).ready(function() 
        {
        $('#form').submit(function() {

    var number = $('#number').val();

    $.ajax({
        type:       "post",
        url:        "test5.jsp",
        data:       "number=" + number,
        success:    
                   function(msg) 
                    {
                          //$('#result').hide();
                          //$("#result").html("<h3>" + msg + "</h3>").fadeIn("slow");
                          $("#result2").html("<h3>"+msg+"</h3>").fadeIn("slow");
        }
    });
return false;
});
});
    </script>
</head> 
<body>
<form id="form" action="" method="post">
Enter number:
    <input id="number" type="text" name="numb" disabled/>
    <input id="enable" type="button" value="Enable">
    <input id="show" type="button" value="show">
     <input id="hide" type="button" value="hide">
<input id="submit" type="submit" value="Calculate Square Root" name="submit"/>
</form>
<p id="result"></p>
<p id="result2"></p>

<强> test5.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page language="java" import="java.sql.* ,java.util.*, javax.servlet.*,javax.servlet.http.*,          abc.database"%>

<%
 String toPrint = "";
int numb = 0;
numb = Integer.parseInt(request.getParameter("number"));
if(request.getParameter("number").matches("9"))
   //if (request.getParameter("number").value 
{
numb = Integer.parseInt(request.getParameter("number")); 
toPrint += "Square root of " + numb + " is " + Math.sqrt(numb);
} 
else {
toPrint += "Enter a number!";
}  
%>

<%
            Connection conn = null ;  
            ResultSet rs = null;
            PreparedStatement ps = null ;
 %>
<%               
            database obj =new database();
            conn = obj.connect(); 
     ps = conn.prepareStatement("select field2 from test4 where field1 = "+numb+"");
            rs = ps.executeQuery();

        while(rs.next())
            {
            String x = rs.getString(1);
            toPrint += "<br/>the value is "+x;
         }  
        conn.close();     rs.close();
        out.print(toPrint);         
%>