2014-04-30 27 views
0

有人可以請更多的經驗幫助我嗎?Contenteditable + JQuery不工作

這不起作用,我不知道爲什麼。

我從互聯網上得到它,但例子是用PHP,所以,不知道。

Update.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 
<%@page contentType="text/html" pageEncoding="UTF-8"%> 
<%@page language="java"%> 
<%@page import="java.lang.*" import="org.postgresql.*" import="java.sql.*"%> 

<!DOCTYPE html> 

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Insert title here</title> 
</head> 
<body> 
<% 
     try { 

      Class.forName("org.postgresql.Driver"); 
      String url = "jdbc:postgresql://localhost:5432/postgres"; 
      Connection connection = DriverManager.getConnection(url, 
        "postgres", "admin"); 

      String strquery = "UPDATE projects SET project = '" 
        + request.getParameter("id") + "'"; 

      Statement st = connection.createStatement(); 

      //System.out.println("Connecting to database..."); 
      ResultSet rs = st.executeQuery(strquery); 

      System.out.println(strquery); 

      rs.close(); 
      st.close(); 
     } catch (Exception e) { 
      System.out.println(e); 
     } 
    %> 
</body> 
</html> 

ContenteditableTest.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 

<!DOCTYPE html> 

<html> 
<head> 
<script type="text/javascript" src="js/jquery-1.9.1.js"></script> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Contenteditable test</title> 

<script> 
    $('.id').keyup(function() { 
     delay(function() { 
      var text = $('.id').text(); 
      $.ajax({ 
       type : "post", 
       url : "update.jsp", 
       data : "text=" + text, 
       success : function(data) { 
        console.log('success bro!'); 
       } 
      }); 
     }, 500); 
    }); 

    var delay = (function() { 
     var timer = 0; 
     return function(callback, ms) { 
      clearTimeout(timer); 
      timer = setTimeout(callback, ms); 
     }; 
    })(); 
</script>  
</head>  
<body> 
    <table> 
     <tr> 
      <td contenteditable="true" class="id">1</td> 
     </tr> 
    </table> 
</body>  
</html> 

回答

1

嗨首先在你的update.jsp你有提到request.getParameter('id')但ContenteditableTest.jsp在AJAX調用你有提到data : "text=" + text,因此要麼在ContenteditableTest.jsp中更改"text=",要麼將"id="更改爲request.getParameter('id')至update.jsp中的request.getParameter('text')

而對於contenteditable屬性,你可以按照這個帖子 https://plus.google.com/114254873085584811912/posts/LqpzvvzoMYc