JavaScript 通过Ajax 动态加载CheckBox复选框


Posted in Javascript onAugust 31, 2017

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<pre name="code" class="html">
<div class="controls" id="compareyear"> 
</div></pre><br> 
<img src="http://img.blog.csdn.net/20170830165326131?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvaGFuMTQ1NTQxODE3MQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt=""><br> 
<br> 
//动态加载年份checkbox by dongch 20170830 function GetCompareYearByStationName(name) { var str = " <label class='control-label'>选择对比年限:</label>"; $.ajax({ type: "GET", //默认是GET url: '@Url.Action("*********", "*****")', data: "stationName=" + name, async: false, //同步 
 cache: false, //不加载缓存 success: function (obj) {//后台传来的数据:"2010,2011,2012,2013,2014,2015" var yearArray = new Array(); yearArray = obj.split(","); for (var i = 0; i < yearArray.length; i++) { if (i < yearArray.length - 3) { str += "<label><input type='checkbox' 
 name='checkbox' value='" + yearArray[i] + "' />" + yearArray[i] + "  </label>"; } else {//后三个年份默认选中 str += "<label><input type='checkbox' name='checkbox' value='" + yearArray[i] + "' checked='checked' />" + yearArray[i] + "  </label>"; } } $("#compareyear").html(str); 
 }, error: function () { alert("对比年限加载失败"); } }); } 
<pre></pre> 
<pre></pre>

总结

以上所述是小编给大家介绍的JavaScript 通过Ajax 动态加载CheckBox复选框,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js从10种颜色中随机取色实现每次取出不同的颜色
Oct 23 Javascript
全面理解面向对象的 JavaScript(来自ibm)
Nov 10 Javascript
jQuery获取当前对象标签名称的方法
Feb 07 Javascript
初识angular框架后的所思所想
Feb 19 Javascript
静态页面html中跳转传值的JS处理技巧
Jun 22 Javascript
基于CSS3和jQuery实现跟随鼠标方位的Hover特效
Jul 25 Javascript
详解浏览器渲染页面过程
Feb 09 Javascript
详解在Vue中如何使用axios跨域访问数据
Jul 07 Javascript
Thinkphp5微信小程序获取用户信息接口的实例详解
Sep 26 Javascript
json前后端数据交互相关代码
Sep 19 Javascript
Vue移动端右滑屏幕返回上一页附源码下载
Jun 26 Javascript
vue 出现data-v-xxx的原因及解决
Aug 04 Javascript
BootStrap下的弹出框加载select2框架失败的解决方法
Aug 31 #Javascript
Angular2 http jsonp的实例详解
Aug 31 #Javascript
BootStrap中Table隐藏后显示问题的实现代码
Aug 31 #Javascript
Cpage.js给组件绑定事件的实现代码
Aug 31 #Javascript
基于canvas粒子系统的构建详解
Aug 31 #Javascript
Vue 组件间的样式冲突污染
Aug 31 #Javascript
js实现加载页面就自动触发超链接的示例
Aug 31 #Javascript
You might like
详解php中空字符串和0之间的关系
2016/10/23 PHP
php实现微信支付之企业付款
2018/05/30 PHP
php的对象传值与引用传值代码实例讲解
2021/02/26 PHP
js跑马灯代码(自写)
2013/04/17 Javascript
Jqgrid设置全选(选择)及获取选择行的值示例代码
2013/12/28 Javascript
Jquery操作js数组及对象示例代码
2014/05/11 Javascript
jQuery中odd选择器的定义和用法
2014/12/23 Javascript
JS+DIV+CSS实现仿表单下拉列表效果
2015/08/18 Javascript
js改变style样式和css样式的简单实例
2016/06/28 Javascript
jQuery validate插件功能与用法详解
2016/12/15 Javascript
js禁止浏览器页面后退功能的实例(推荐)
2017/09/01 Javascript
Nodejs监听日志文件的变化的过程解析
2019/08/04 NodeJs
微信小程序 (地址选择1)--选取搜索地点并显示效果
2019/12/17 Javascript
基于JS判断对象是否是数组
2020/01/10 Javascript
JS求解两数之和算法详解
2020/04/28 Javascript
js实现拖拽元素选择和删除
2020/08/25 Javascript
[02:02]特效爆炸!DOTA2珍宝之瓶待你开启
2018/08/21 DOTA
[43:32]Winstrike vs VGJ.S 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
200行自定义python异步非阻塞Web框架
2017/03/15 Python
python 实现return返回多个值
2019/11/19 Python
python中的subprocess.Popen()使用详解
2019/12/25 Python
win10安装tesserocr配置 Python使用tesserocr识别字母数字验证码
2020/01/16 Python
使用python tkinter开发一个爬取B站直播弹幕工具的实现代码
2021/02/07 Python
HTML5本地存储之Web Storage详解
2016/07/04 HTML / CSS
德国最大的设计师鞋网上商店:Budapester
2017/12/07 全球购物
Douglas意大利官网:购买香水和化妆品
2020/05/27 全球购物
Shell编程面试题
2016/05/29 面试题
入党积极分子自我鉴定
2014/02/18 职场文书
毕业生学校推荐信范文
2014/05/21 职场文书
阳光体育活动实施方案
2014/05/25 职场文书
材料物理专业求职信
2014/09/01 职场文书
代办出身证明书
2014/10/21 职场文书
2015年村计划生育工作总结
2015/04/28 职场文书
2015年妇委会工作总结
2015/05/22 职场文书
七一活动主持词
2015/06/29 职场文书
MySQL中int (10) 和 int (11) 的区别
2022/01/22 MySQL