Question

晚上，这真是我网站准备进行测试的最后一块。

无法正确理解这一点。

所以即时建立一个博客cms。

我的博客文章已经反映在他们自己的div中。在这个div中也是隐藏的ckeditor文本区域。

如果用户已登录及其博客，则可以看到编辑按钮，单击时会隐藏当前文本并显示ckeditor。

这是可以的，当显示ckeditor时，它也会显示一个保存按钮。

在单击“保存”按钮时，会进行一些验证，并对update.php页面进行ajax调用，更新博客。一切都很好！

但是，我试过的是当php页面的响应没问题时，隐藏编辑器，并更新该div的当前内容。

到目前为止，我已经使用了这个：

$("#container").load("#container");

#container是一个包含所有博客信息的主要容器，它在重新加载内容时有意义。但是，如果我再次单击编辑按钮，则不会替换文本区域，并且文本区域周围的红色边框表示已提交，并且为空。如果它是空的，我会设置一个红色边框。

.load（）似乎弄乱了页面上的其他脚本。

我正确使用.load（）函数吗？我怎么能重新加载当前的div，因为我觉得它更有效。

我在考虑为每个博客文章div分配自己唯一的ID，然后将其发送到php页面并将其与响应一起发回。

然后做例如。

 $("#container").load(response.blogPostID),

但我只是想知道我是否会按照我应该的方式进行此操作，并且也将是非马车等。

最糟糕的情况是，我必须在每次编辑后执行页面重新加载，但它并不像我想要的那样感觉光滑。

我知道这些示例谈论从另一个页面加载内容然后从中加载某个div。但我构建我的网站的方式是它只有一个查询和博客帖子通过foreach循环回显。

只需知道如何在当前页面上重新加载单个div而不影响其他脚本等。

如果需要，我可以在我的网站上设置一个测试帐户和博客作为示例。

克雷格！

编辑：这是点击编辑按钮时的javascript：

$(".edity").click(function () {
     $(this).parent().find('.edity').toggle();
     $(this).parent().find('.saveupdatebutton').toggle();
     $(this).parent().find('.updatebutton').toggle();
     $(this).parent().find('.editor').toggle();
     $(this).parent().find('.buildtext').toggle();
     $(this).parent().find('.deleteupdatebutton').toggle();
});

这是ajax电话：

if (check) {
            $.ajax({
                type: "POST",
                url: "process/updatepost.php",
                data: $targetForm.serialize(),
                dataType: "json",
                success: function (response) {

                    if (response.databaseSuccess)
                    $("#container #postholder").load("http://url.com/viewblog.php?id=155 #container #postholder");
                    else
                    $ckEditor.after('<div class="error">Something went wrong!</div>');

                }
            });
        }

这是数据显示在页面上的方式：

<div class="blogtest" id="156">
<form action="process/updatepost.php" class="updatepost" method="post">
<input type="button" class='.$editenabled.' value="Edit">
<input type="submit" name="saveupdatebutton" class="saveupdatebutton" value="Save">
<input type="submit" name="deleteupdatebutton" class="deleteupdatebutton" value="Delete">
<input type="hidden" class="postid" name="postid" value="'.$postID.'">
<input type="hidden" class="editorid" name="editorid" value="'.$ckEID.'">
<input type="hidden" class="pageurl" name="pageurl" value="'.$pageurl.'">
<input type="hidden" name="buildowner" value="'.$buildcreator.'" />
<br>

<div class="text">

<div class="buildtext" id="'.$postID.'">'.$convertedtext.'</div>

<div class="editor"><textarea name="muffin" id="'.$ckEID.'" class="ckeditor">'.$text.'</textarea></div>

</div>

</form>

</div>

Answer 1

有点难以理解你想要做什么，但我会试一试......

你不能只使用.html（）替换编辑所在的div内的内容。如果您已将新数据发送到使用ajax的位置，则应该设置变量，或者能够为发送到服务器的内容设置变量，因此希望在div中使用。

$("#container").html(what ever you used as data for the ajax request)

或者那种效果。

但如果我们至少可以看到某种形式的代码段，那将会容易得多。

希望这有帮助

我可能已经解释得更好让我知道如果它没有意义我会再试一次：）

Answer 2

我不建议每次都用ajax调用重新加载整个页面，ajax调用的优点是你可以加载单独的部分以节省大量带宽，所以你猜对了。

我不知道update.php究竟返回什么，如果这只能返回整个页面，那么它就是智能的，只能返回一个只返回博客文章的特殊功能

然后调用会像（GET请求不是我的第一选择，这取决于你的系统）

$( "#container #blog" + blogPostId ).load( "update.php?q=updatePost&id="+blogPostId );

要快速修复，只需为每个帖子的div添加一个唯一的ID并将其添加到您的加载调用

$("#container #blogPost"+blogPostId).load("*url* #container #blogPost"+blogPostId);

Answer 3

事件委托是我所追求的，似乎这就是答案：

$(document).on('click','.edity',function(){
    // DO SOMETHING
)};

正确的方法来重新加载已编辑的博客文章

3 个答案: