自動擴展div如果textarea有內容

Question

我正在使用PHP/MySQL創建一個博客，並且有一個編輯帖子功能。

當點擊「編輯」頁面「刷新」（進入同一頁面但URL改變）時，<div>展開，他們想要編輯的帖子文本現在顯示在<textarea>中。

在另一個SO用戶的幫助下，我完成了部分工作。唯一的問題是它將可編輯文本放入每個<texarea>框中。

這裏有一個工作示例：http://thebulb.daysofthedead.net/testing.php

我對如何得到這個工作的一些想法，但不知道如何做到這一點，因爲我不擅長使用jQuery或Ajax的：

1. 添加一個帶有可編輯內容的<textarea>的ID，並將該ID傳遞給jQuery腳本的 。
2. 不要更改頁面，只需使用Ajax至 將他們要編輯的文本插入到<textarea>。
3. 當他們點擊「編輯」時，將帶有文字的框變爲<textarea>框與 提交表單。我可以通過使用我發現的 （http://jsfiddle.net/25Hay/2/），但我不知道如何將 提交到我的PHP腳本進行驗證並插入到數據庫中來找到該部分。

這裏是我的jQuery目前使用：

$(function(){ 
    // Insert editable text into the <textarea> box 
    $('.blogcontainer textarea[name=postcontent]').filter(function(i) { return $.trim($(this).val()) != ""; }).closest('.postreplycontainer').slideDown("fast"); 

    // Execute when Edit link is clicked 
    $(document).on('click', '.postreply', function(e) { 
     // Collapse all previous expanded <div>'s 
     $(this).closest('.blogcontainer').siblings('.blogcontainer').find('.postreplycontainer').slideUp("fast"); 
     // Expand/Collapse <div>' when "Post Reply" is clicked 
     $(this).closest('.blogcontainer').find('.postreplycontainer').slideToggle("fast") 
      // Focus <textarea> when <div> is expanded 
      .find('textarea[name=postcontent]').focus(); 
    }); 
});