Question

我想为帖子创建一个预览功能，允许人们查看他们输入文本区域的输出，一旦提交就会显示。论坛使用bbcode并且不允许在帖子中使用html，而textarea框的id是“message”

任何人都可以帮我创建一个弹出窗口，在弹出窗口中预览这篇文章而不将其任何数据传递到数据库并返回吗？

我应该提供更多信息，我意识到......基本上我们有一个

形式的帖子表格

<textarea id=\"message\" name=\"message\" style=\"width:515; height:160; font-family: Verdana; font-size: 8pt; color: #000000\" onKeyDown=\"countit()\"></textarea>

带有提交按钮

<input type=\"image\" src=\"newlayout/images/reply.png\" height=\"35\" width=\"109\" border=\"0\" alt=\"Submit\">

单击它时，表单将被发送到另一个页面，从该页面插入到数据库中。我希望有一个像livejournal上的预览按钮，在那里创建一个新的弹出窗口并显示帖子的样子。我查看了livejournal上的源代码并提供了jQuery，所以我尝试了这里给出的代码：http://haacked.com/archive/2009/12/15/live-preview-jquery-plugin.aspx 然而，这没有用，因为没有出现，我也不喜欢现场预览的想法。

我也尝试过这里的javascript代码：http://www.codingforums.com/showthread.php?t=174810，但是再一次，它没有提出任何东西......

我希望这是一个很好的信息，如果我应该包含其他任何内容，请告诉我：）

Answer 1

这个问题越来越接近“为我编写代码”，但如果您只是想获得最佳方法的帮助，请参阅以下几个：

最干净的是有一个按钮（通过javascript）更改表单的action和target并触发提交（）...这会通过帖子将所有数据发送到模板页面，它可以获取$ _POST数据并将其放入模拟实时模板的模板中。

或者，您可以让JavaScript / Jquery获取所有字段值，并在javascript中构建HTML模板，然后将其传递到页面上的div，该样式的样式（a）类似于pop- up和（b）有css模仿实况页面。

有很多方法可以做到这一点，但这些方法都有效。如果你尝试了一些事情并进入紧张的地方，请告诉我们，我们会帮你一把。

Answer 2

您可能希望将keyup事件绑定到textarea。每次用户释放密钥时，它都会触发该功能。然后你的函数抓住textarea的值并解析它为BBCode，我不熟悉。然后它将获取该输出并将其作为任何元素的内容。

HTML：

<textarea id="myText"></textarea>

<div id="preview"></div>

JavaScript（jQuery）：

$(document).ready(function() {

    var $textarea = $('#myText'),
        $preview = $('#preview');

    $textarea.on('keyup', function() {

        var $this = $(this),
            output = $this.val();

        // Do something with the value of the code to parse out the BBCode stuff.

        $preview.html(output);

    });

});

Answer 3

为什么不尝试像TinyCME或CKEditor这样的WYSIWYG编辑器？

textarea输入的弹出预览

3 个答案: