Question

我在用于提交帖子的页面上有一个textarea，比如在聊天或论坛中。为了显示帖子的格式，我试图使用javascript尝试使用预览功能。单击预览链接后，脚本应从textarea（id = inputinsertcommentary）获取文本并将其发布到弹出窗口（postvorschau.php），然后使用$ _POST变量进行预览。这是我的剧本：

function postvorschau() {
    var url = 'www.page.com/folder/postvorschau.php';
    var form = document.createElement('form');
    form.action = url;
    form.method = 'POST';
    form.setAttribute("target", "_blank");

    var text = document.getElementById('inputinsertcommentary').value; 
    var postname ='posting';
        var input = document.createElement('input');
        input.type = 'hidden';
        input.name = postname;
        input.value = text;
        form.appendChild(input);
form.submit();
}

这里是调用该函数的链接：

<a href='javascript: postvorschau();'>Postvorschau</a>

据我在浏览器日志（firefox）中看到，该函数被调用并且不会产生任何错误。但是，没有打开弹出窗口 - 我想我的语法中的某些内容是错误的，但从查看类似的示例我无法弄清楚是什么。非常感谢任何帮助！

Answer 1

使用ajax将内容从textarea发送到后端脚本的基本示例。 php脚本可能会格式化数据，然后将其打印出来。

<?php
    /* postvorschau.php: format data and send back to callback */
    if( !empty( $_POST ) ) {
        /* you would send back formatted data probably - whatever that might be */
        exit( json_encode( $_POST, true ) );
    }
?>

<!doctype html>
<html>
    <head>
        <meta charset='utf-8'>
        <title>html preview</title>
    </head>
    <body>
        <form>
            <textarea name='inputinsertcommentary' cols=80 rows=10 style='resize:none' placeholder='Enter comments / data here and use preview button / link'></textarea>
            <a href='#'>Preview</a>
        </form>
        <script>
            var olnk=document.querySelectorAll('form a')[0];
            olnk.onclick=preview;

            function preview(e){
                /* get textarea ~ you could use ids instead of course */
                var oTxt=e.target.parentNode.querySelectorAll('textarea')[0];
                /* create request object */
                var xhr = new XMLHttpRequest();
                xhr.onreadystatechange=function(){
                    /* invoke callback with response data */
                    if( xhr.readyState==4 && xhr.status==200 ) cbpreview.call( this, xhr.response );
                };

                xhr.open( 'POST', '/folder/postvorschau.php' );
                xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
                xhr.send( 'data='+oTxt.value ); 
            }

            function cbpreview(r){
                alert( r );/* use this callback to generate the "popup" using "r" as the data, either formatted or raw */
            }
        </script>
    </body>
</html>

Javascript从textarea＆amp;提取文本发布到php页面

1 个答案: