留言板中,发表信息的时候,使用Ajax存储到后台数据库,如果存储成功,不重新加载数据库,直接显示发表内容。

代码:

var Nicehng = '';
var kkimgpath = '';
var text = ''; $(function () {
if ($(document).scrollTop() != 0) {
//刷新之后,回到顶部
$('body,html').animate({ scrollTop: 0 }, 300);
}
//点击发表留言
$("#submit").click(function () {
editor.sync();
text = $.trim($('#KindEditor').val());//获取KindEditor的内容
if (text == "") {
art.dialog({ id: 'TS', width: 325, height: 170, content: '请输入内容!' });//显示提示文本框
}
else { Nicehng = $.trim($("#NiCheng").val());
if (Nicehng == "") {
Nicehng = '匿名';
}
var IgP = Imgpath();
kkimgpath = "../Images/demopage/image-" + IgP + ".jpg"; $.ajax({
type: "POST",
url: "Handeler/Ajax.ashx",
data: "NiCheng=" + Nicehng + "&Imgpath=" + kkimgpath + "&text=" + text + "",
success: function (msg) {
if (msg == "Null") {
art.dialog({ id: 'TS', width: 325, height: 170, content: '参数为空,请联系管理员!' });
}
if (msg == "True") {
PageBindData();//当数据库存储成功时,在前台显示发表内容。
//清空
$("#NiCheng").val();
$("#Radio1").attr("checked","checked");
$("#KindEditor").val();
//回到顶部
$('body,html').animate({ scrollTop: 0 }, 500);
}
if (msg == "False") {
art.dialog({ id: 'TS', width: 325, height: 170, content: '发表失败!' });
}
}
});
}
}) //获取Radio选中图片的值
function Imgpath() {
var val = $('input:radio[name="Img"]:checked').val();
if (val == null) {
return "";
}
else {
return val;
}
} function PageBindData() {
var mydate = new Date();
var t = mydate.toLocaleString();
var imgpath = kkimgpath;
var name = Nicehng;
var ip = '121.123.123.12';
var content = text;
var time = t;
//$("#newcontent").prepend("<div><ul><li><div><img src='" + kkimgpath + "'/></div></li><li><div><span>" + name + "</span></div></li><li><div><span>" + ip + "</span></div></li></ul></div><div><div>" + content + "</div><div><ul><li ><span >2楼</span></li><li ><span>" + time + "</span></li><li><a href='####' >回复</a></li></ul></div></div>"); $("#newcontent").prepend("<div class= 'messagecontent'><div class='maincontent'><ul><li><div class='smheadimg'><img class='img' src='" + kkimgpath + "'></div></li><li><div class='smname'><span class='smnamesm'>" + name + "</span</div></li><li><div class='smip'><span class='smipsm'>" + ip + "</span></div></li></ul></div><div class='cmcontent'><div class='cmcontentsm'>" + content + "</div><div class='reply'><ul class='replyul'><li><span class='floor'>2楼</span></li><li><span class='time'>" + time + "</span></li><li><a class='smreply' href='javascript:void(0)'>回复</a></li></ul></div> </div></div>");
}
})

  

JQuery - 留言之后,不重新加载数据,直接显示发表内容的更多相关文章

  1. jquery easyui easyui-treegrid 使用异步加载数据

    jquery easyui easyui-treegrid 使用异步加载数据 jquery easyui easyui-treegrid 异步请求 >>>>>>&g ...

  2. Fullcalendar改版后发布到IIS或者tomcat里面前端加载数据不显示的问题

    问题如题:Fullcalendar改版后发布到IIS或者tomcat里面前端加载数据不显示的问题 解决办法:通过火狐浏览器工具发现是时间格式不对的原因,需要将时间格式修改为:yyyy-MM--DD   ...

  3. jQuery+Ajax滚屏异步加载数据实现(附源码)

    一.CSS样式 body { font:12px/1.0em Microsoft Yahei; line-height:1.6em; background:#fff; line-height:1.2e ...

  4. viewPager使用时加载数据时显示IllegalStateException异常,解决不了。。。。

    从newsPager中得到newsDetailTitles标题的详细内容,这是通过构造器传过来的.打印日志78行能打印,45行打印出来共size是12.但是程序出现了异常java.lang.Illeg ...

  5. 当vue 页面加载数据时显示 加载loading

    参考:https://www.jianshu.com/p/104bbb01b222 Vue 页面加载数据之前增加 `loading` 动画 创建组件 1.新建 .vue 文件: src -> c ...

  6. jquery加载数据时显示loading加载动画特效

    插件下载:http://www.htmleaf.com/jQuery/Layout-Interface/201505061788.html 插件使用: 使用该loading加载插件首先要引入jQuer ...

  7. android左右滑动加载分页以及动态加载数据

    android UI 往右滑动,滑动到最后一页就自动加载数据并显示 如图: package cn.anycall.ju; import java.util.ArrayList; import java ...

  8. Android GridView 分页加载数据

    android UI 往右滑动,滑动到最后一页就自动加载数据并显示 如图: package cn.anycall.ju; import java.util.ArrayList; import java ...

  9. android 批量加载数据

    public class MainActivity extends Activity { private ListView listView; private List<String> d ...

随机推荐

  1. Eclipse使用技巧总结(一)

    一.建立工作空间 如上图所示,可以建立新的工作空间,或者切换工作空间. 二.导入导出工作空间配置 三.设置行号 如图,用鼠标在坐变阴影部分右击弹出菜单,选中Show Line Numbers一项. 四 ...

  2. Raphael入门实例:绘图

    raphael 实例 开始 创建画布参数说明 创建一个画布对象. 下面每个例子都会创建一个320*200大小的画布. ? 1 2 // 1.在视口的 (10,50) 坐标位置上创建画布 var pap ...

  3. get get_children方法

    get 方法: [root@wx03 zook]# cat a4.pl use ZooKeeper; use AnyEvent; use AE; use Data::Dumper; my $zk = ...

  4. 基于visual Studio2013解决C语言竞赛题之0525拉丁方阵

     题目

  5. (未解决)在JSTL中,session 和 sessionScope 有什么区别 ??

    在JSP页面中,使用JSTL标签获取Session中的值并显示 为何当使用 ${session.user} 时,页面跳转后,第一次能够成功显示, 但是单击按钮重定向的时候,就获取不到了? 而使用 ${ ...

  6. UVa 121 - Pipe Fitters

    称号:放置在一个圆中的矩形,它要求每个圆的每行或列是切线,问:多少能竖起来. 分析:计算几何.数论.首先计算矩形显示屏,然后计算互显示器(每一行与相邻行相同差1个月)求最大,你可以. 说明:╮(╯▽╰ ...

  7. windows下使用openssl的一种方法

    下载openssl之后,全部解压到一个路径下,如:c:\program files\openssl sdk 举个例子,如使用SHA1,开发时引用头文件: #include <sha.h> ...

  8. jQuery格式化时间插件formatDate

    一.不传时间 $.formatDate("yyyy-MM-dd HH:mm:ss");   二.传时间 $.formatDate("yyyy-MM-dd HH:mm:ss ...

  9. Docker学习笔记(4) — 开启Docker远程访问

    默认情况下,Docker守护进程会生成一个socket(/var/run/docker.sock)文件来进程本地进程通信,而不会监听任何端口,因此只能在本地使用docker客户端或者使用Docker ...

  10. 用Python做2048游戏 网易云课堂配套实验课。通过GUI来体验编程的乐趣。

    第1节 认识wxpython 第2节 画几个形状 第3节 再做个计算器 第4节 最后实现个2048游戏 实验1-认识wxpython 一.实验说明 1. 环境登录 无需密码自动登录,系统用户名shiy ...