我想知道 - 我如何制作类似Facebook或Twitter的帖子系统 - 当我在postarea中输入文本并单击提交时,它会将数据插入数据库并立即显示我刚刚输入的内容? 我有这个JS代码
$(function()
{
$(".inpPostBtn").click(function()
{
var textcontent = $("#postTextarea").val();
var dataString = 'postTextarea='+ textcontent;
if(textcontent=='')
{
alert("Enter some text..");
$("textarea").focus();
}
else
{
$("#flash").show();
$("#flash").fadeIn(400).html('<span class="load">Loading..</span>');
$.ajax({
type: "POST",
url: "insertPost.php",
data: dataString,
cache: true,
success: function(html)
{
$("#show").after(html);
document.getElementById('postTextarea').value='';
$("#flash").hide();
$("#postTextarea").focus();
}
});
}
return false;
});
});
和这个PHP代码:
<?php
include('inc/connect.php');
session_start();
$username = $_SESSION['user_login'];
$userSql = 'SELECT * FROM users WHERE username="'.$username.'"';
$userRes = mysql_query($userSql);
$user = mysql_fetch_assoc($userRes);
$postBody = mysql_real_escape_string($_POST['postTextarea']);
$postDate = date('Y-m-d');
$postTime = date('H:i:s');
$postAuthor = $user['firstname']." ".$user['lastname'];
$postAuthorID = $user['id'];
$sql = "INSERT INTO posts (body,author,postDate,postTime,posterID) VALUES ('".$postBody."','".$postAuthor."','".$postDate."','".$postTime."','".$postAuthorID."')";
$query = mysql_query($sql);
?>
最后发布帖子的HTML代码(遗憾地在重新加载页面后):
<div class="friendPosts">
<div class="postMain">
<div class="friendPic">
<img src="img/profile.jpg" class="profilePic" />
</div>
<div class="nameDate">
<div class="friendName">
<a href=""><?php echo $post['author']; ?></a> <span><b>·</b> <?php echo $post['postDate']; ?> <?php echo $post['postTime']; ?></span><?php if($post['posterID'] == $user['id']) { ?><a href="" title="Delete post"><span style="float: right;" class="deletePost">X</span></a><?php } ?>
</div>
</div>
<div class="friendPost">
<?php
$myposts = $post['body'];
echo "<p>".$myposts."</p>";
?>
</div>
<div class="postMenu">
<a href="">Like</a> <b>/</b> <a href="">Dislike</a> <b>·</b> <a href="">Share</a> <b>·</b> <a class=".toggleComment">Comment (10)</a> <b>·</b> <a href="">Flag</a>
</div>
</div>
</div>
希望你能提供帮助。感谢。
答案 0 :(得分:1)
如果您使用AJAX调用提交表单,我建议它看起来像这样:
var input = $("#term").val(); /*your input field*/
$.ajax({
type: "POST",
url: 'search',
data: {
term: input,
},
success: function(response) {
$('#divToShowStuff').append(response);
}
});
在这种情况下,我提交表单并将其发送到我的PHP框架中的搜索控制器。需要数据字段来获取从客户端到服务器端的输入。所以在我的搜索中我打电话:
$_POST['term']
并且成功显示搜索控制器在客户端div中发送给他的视图。
希望这会有所帮助。