JQuery - 留言之后,不重新加载数据,直接显示发表内容
留言板中,发表信息的时候,使用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 - 留言之后,不重新加载数据,直接显示发表内容的更多相关文章
- jquery easyui easyui-treegrid 使用异步加载数据
jquery easyui easyui-treegrid 使用异步加载数据 jquery easyui easyui-treegrid 异步请求 >>>>>>&g ...
- Fullcalendar改版后发布到IIS或者tomcat里面前端加载数据不显示的问题
问题如题:Fullcalendar改版后发布到IIS或者tomcat里面前端加载数据不显示的问题 解决办法:通过火狐浏览器工具发现是时间格式不对的原因,需要将时间格式修改为:yyyy-MM--DD ...
- jQuery+Ajax滚屏异步加载数据实现(附源码)
一.CSS样式 body { font:12px/1.0em Microsoft Yahei; line-height:1.6em; background:#fff; line-height:1.2e ...
- viewPager使用时加载数据时显示IllegalStateException异常,解决不了。。。。
从newsPager中得到newsDetailTitles标题的详细内容,这是通过构造器传过来的.打印日志78行能打印,45行打印出来共size是12.但是程序出现了异常java.lang.Illeg ...
- 当vue 页面加载数据时显示 加载loading
参考:https://www.jianshu.com/p/104bbb01b222 Vue 页面加载数据之前增加 `loading` 动画 创建组件 1.新建 .vue 文件: src -> c ...
- jquery加载数据时显示loading加载动画特效
插件下载:http://www.htmleaf.com/jQuery/Layout-Interface/201505061788.html 插件使用: 使用该loading加载插件首先要引入jQuer ...
- android左右滑动加载分页以及动态加载数据
android UI 往右滑动,滑动到最后一页就自动加载数据并显示 如图: package cn.anycall.ju; import java.util.ArrayList; import java ...
- Android GridView 分页加载数据
android UI 往右滑动,滑动到最后一页就自动加载数据并显示 如图: package cn.anycall.ju; import java.util.ArrayList; import java ...
- android 批量加载数据
public class MainActivity extends Activity { private ListView listView; private List<String> d ...
随机推荐
- 断开/删除 SVN 链接(.svn)的几种方法
上传到正式的服务器时需要去掉这些不必要的文件,找到了几种方法: 1.windows下: xcopy project_dir project_dir_1 /s /i (从project_dir 复制文件 ...
- 浙江大学2015年校赛F题 ZOJ 3865 Superbot BFS 搜索
不知道为什么比赛的时候一直想着用DFS 来写 一直想剪枝结果还是TLE = = 这题数据量不大,又是问最优解,那么一般来说是用 BFS 来写 int commandi[4] = {1, 2, 3, 4 ...
- RunLoop学习总结
开始 很久之前就看了一次YY的文章,没看懂.后来又看了sunny的视频和叶孤城的直播的视频,找了很多资料,对RunLoop也越来越清晰,然后又看了两三次YY的文章,虽然还没完全看懂,不得不说写的非常好 ...
- 开发快很重要——如果只看法语或者产品结果C++似乎很强大,但是参与这个C++的开发过程,就会感觉到这种痛苦(Google也是这个看法)
开发快很重要——如果只看语法或者产品结果C++似乎很强大,但是参与这个C++的开发过程,就会感觉到这种痛苦,太慢了,太麻烦了,虽然在反复调试和优化之后,最后产品的结果可能还不错. Delphi的最大特 ...
- Spirng+SpringMVC+Maven+Mybatis+MySQL项目搭建(转)
这篇文章主要讲解使用eclipse对Spirng+SpringMVC+Maven+Mybatis+MySQL项目搭建过程,包括里面步骤和里面的配置文件如何配置等等都会详细说明. 如果还没有搭建好环境( ...
- 一个load飙高的过程分析,非常有价值(转)
关于us高和sy高的问题分析: 当us值过高时,表示运行的应用消耗大量的CPU.java应用造成us高的原因主要是线程一直处于可运行(Runnable)状态,通常这些线程在执行无阻塞.循环.正则或纯粹 ...
- 基于visual Studio2013解决C语言竞赛题之0515国名排序
题目
- Oracle时间戳
查询某一具体时间某张表的数据,可以用时间戳进行查询. 例如: SELECT * FROM sac14 AS OF TIMESTAMP to_date('201508310930','yyyymmddh ...
- HDOJ4006 The kth great number 【串的更改和维护】
The kth great number Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65768/65768 K (Java/Oth ...
- CVPapers论文整理工具-开源
一.工具介绍及运行实例 相信计算机视觉领域的同道中人都知道这个Computer Vision Resource网站, http://www.cvpapers.com/ 网页部分截图如下: 可以看到有 ...