我在页面上有一个文本区域，用于提交帖子，例如在聊天或论坛中。为了展示帖子的格式如何，我尝试使用 javascript 使预览功能正常工作。单击预览链接后，脚本应从文本区域 (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)中看到，该函数被调用并且不会产生任何错误。但是，没有打开弹出窗口 - 我想我的语法中有些东西是错误的，但通过查看类似的示例，我无法真正弄清楚是什么。非常感谢任何帮助!
最佳答案
使用 ajax 将文本区域中的内容发送到后端脚本的基本示例。 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 从文本区域获取文本并发布到 php 页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34564907/