0

我正在使用 PHP / MySQL 创建一个博客，并且有一个编辑帖子功能。

单击“编辑”时，页面“刷新”（转到同一页面但 URL 更改），<div>他们想要编辑的帖子的展开和文本现在显示在<textarea>.

在另一个 SO 用户的帮助下，我完成了部分工作。唯一的问题是它将可编辑的文本放入每个<texarea>框中。

这是一个工作示例：http ://thebulb.daysofthedead.net/testing.php

我对如何让它工作有一些想法，但不知道如何去做，因为我不擅长 jQuery 或 Ajax：

  1. 将 ID 添加到<textarea>可编辑内容并将该 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();
    });
});
4

1 回答 1

1

1）添加data-id到文本区域将是一种简单的方法。当您想编辑帖子时，我看到您的 URL 中已经有post_id=5，所以我猜您可以使用它（我找不到您用于更新 textareas 的脚本）

2) 和 3)

带有 jQ​​uery 的 Ajax 真的很容易使用。你可以在这里阅读更多关于它的信息http://api.jquery.com/jquery.ajax/

这是一个 JSFiddle 示例。

$.ajax({
    url: '/echo/html/', // for JSfiddle only, here you will use the url that you normaly put in a form taget
    data: {
        textarea: textarea_value,
        postID: post_id,
        html: textarea_value // so jsFIDDLE can answer
    }, // this is the data you send to that URL, in this case it's your value, in PHP you will then get them with $_POST['textarea'] or $_POST['postID']
    type: 'post', // default is get, you can set it to post or head, text etc...
    success: function (answer) {
        // answer is what you get back from the server if the data was sent
        alert(answer)
    },
    error: function () {
        alert('something went wrong')
    }
});
于 2013-06-27T11:17:58.857 回答