用jQuery向div中添加Html文本内容的简单实现


Posted in Javascript onJuly 13, 2016

前台代码:

<link href="https://3water.com/Content/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://3water.com/Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="https://3water.com/Scripts/jquery-ui.js" type="text/javascript"></script>
function PoeviewExcel() {
  $.ajax(
  {
   url: "send/index",
   type: "post",
   success: function (data) {
    var divshow = $("#showInfo2");
    divshow.text("");// 清空数据
    divshow.append(data); // 添加Html内容,不能用Text 或 Val
    divshow.dialog({
     title: "短信群发系统",
     height: 250,
     width: 580
    });

   }
  }
  );
  return false;
 }
<a href="#" onclick="return PoeviewExcel()">预览数据</a> 
<div id="divPreview" style="display: none">  
<text id="showInfo2"></text> 
</div>

后台(主要):

public string GetImportReport()
  {
   DataTable dt = this.ImportExcel();
   string content = String.Empty;
   content = @"<table width='550' border='0' cellspacing='0' cellpadding='0' bgcolor='#D2D2D2'>"
     + " <tr bgcolor='#336699'>"
     + " <td align='center'><strong>序号</strong></td>"
     + " <td align='center'><strong>目标手机号</strong></td>"
     + " <td align='center'><strong>发送内容</strong></td>"
     +"</tr>";
   for (int i = 0; i < dt.Rows.Count; i++)
   {
    content += "<tr>"
     + " <td width='50' align='center'>" + i.ToString()+"</td>"
     + " <td width='150' align='center'>" + dt.Rows[i][0].ToString() + "</td>"
     + " <td width='150' >" + dt.Rows[i][1].ToString() + "</td>"
     + " </tr>";
   }
   content += "</table>";
   return content;
  }

说明:

divshow.append(data); // 添加Html内容,不能用Text 或 Val

当然用 after();会在该div中不断追加信息。

如果用Text:显示加载的文本内容;

如果用Val:点击链接第一次为空窗口,再点击才出现数据显示、

以上这篇用jQuery向div中添加Html文本内容的简单实现就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript实现的距离现在多长时间后的一个格式化的日期
Oct 29 Javascript
JQuery写动态树示例代码
Jul 31 Javascript
JQuery对class属性的操作实现按钮开关效果
Oct 11 Javascript
基于Jquery实现焦点图淡出淡入效果
Nov 30 Javascript
iscroll.js的上拉下拉刷新时无法回弹的解决方法
Feb 18 Javascript
Bootstrap 3 按钮标签实例代码
Feb 21 Javascript
深入剖析Express cookie-parser中间件实现示例
Feb 01 Javascript
详解vue-loader在项目中是如何配置的
Jun 04 Javascript
vue中各选项及钩子函数执行顺序详解
Aug 25 Javascript
性能优化篇之Webpack构建速度优化的建议
Apr 03 Javascript
javascript 高级语法之继承的基本使用方法示例
Nov 11 Javascript
微信小程序实现列表左右滑动
Nov 19 Javascript
使用jQuery加载html页面到指定的div实现方法
Jul 13 #Javascript
用原生JS对AJAX做简单封装的实例代码
Jul 13 #Javascript
javascript类型系统——undefined和null全面了解
Jul 13 #Javascript
javascript类型系统——日期Date对象全面了解
Jul 13 #Javascript
浅谈javascript中关于日期和时间的基础知识
Jul 13 #Javascript
jQuery EasyUI菜单与按钮详解
Jul 13 #Javascript
JQuery对ASP.NET MVC数据进行更新删除
Jul 13 #Javascript
You might like
PHP面向对象学习笔记之二 生成对象的设计模式
2012/10/06 PHP
分享PHP-pcntl 实现多进程代码
2016/09/30 PHP
php与python实现的线程池多线程爬虫功能示例
2016/10/12 PHP
javascript 构建一个xmlhttp对象池合理创建和使用xmlhttp对象
2010/01/15 Javascript
一些常用且实用的原生JavaScript函数
2010/09/08 Javascript
在jQuery ajax中按钮button和submit的区别分析
2012/10/07 Javascript
IE浏览器不支持getElementsByClassName的解决方法
2014/08/27 Javascript
jQuery焦点图左右转换效果
2016/12/12 Javascript
JQuery查找子元素find()和遍历集合each的方法总结
2017/03/07 Javascript
javascript 判断用户有没有操作页面
2017/10/17 Javascript
Vue如何从1.0迁移到2.0
2017/10/19 Javascript
基于JS实现带动画效果的流程进度条
2018/06/01 Javascript
小程序实现订单倒计时功能
2019/04/23 Javascript
vue-cli脚手架的.babelrc文件用法说明
2020/09/11 Javascript
python查询sqlite数据表的方法
2015/05/08 Python
Python3 模块、包调用&amp;路径详解
2017/10/25 Python
pyqt5简介及安装方法介绍
2018/01/31 Python
在python2.7中用numpy.reshape 对图像进行切割的方法
2018/12/05 Python
解决python tkinter界面卡死的问题
2019/07/17 Python
python实现最大优先队列
2019/08/29 Python
python运用pygame库实现双人弹球小游戏
2019/11/25 Python
pytorch 获取tensor维度信息示例
2020/01/03 Python
计算pytorch标准化(Normalize)所需要数据集的均值和方差实例
2020/01/15 Python
python GUI库图形界面开发之PyQt5表单布局控件QFormLayout详细使用方法与实例
2020/03/06 Python
IDLE下Python文件编辑和运行操作
2020/04/25 Python
Python实现手势识别
2020/10/21 Python
健身场所或家用健身设备:Life Fitness
2017/11/01 全球购物
Linux内核的同步机制是什么?主要有哪几种内核锁
2016/07/11 面试题
技术学校毕业生求职信分享
2013/12/02 职场文书
博士学位自我鉴定范文
2013/12/26 职场文书
致跳高运动员广播稿
2014/01/13 职场文书
幼儿园六一儿童节主持节目串词
2014/03/21 职场文书
2015年度护士个人工作总结
2015/04/09 职场文书
2015秋季新学期开学寄语
2015/05/28 职场文书
员工旷工检讨书
2015/08/15 职场文书
CSS中妙用 drop-shadow 实现线条光影效果
2021/11/11 HTML / CSS