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 相关文章推荐
JavaScript 组件之旅(一)分析和设计
Oct 28 Javascript
jquery模拟LCD 时钟的html文件源代码
Jun 16 Javascript
Node.js 异步编程之 Callback介绍(一)
Mar 30 Javascript
JavaScript对象反射用法实例
Apr 17 Javascript
Angular Js文件上传之form-data
Aug 28 Javascript
深入理解JavaScript中为什么string可以拥有方法
May 24 Javascript
详解vue移动端日期选择组件
Feb 22 Javascript
详解各版本React路由的跳转的方法
May 10 Javascript
跨域解决之JSONP和CORS的详细介绍
Nov 21 Javascript
详解vue在项目中使用百度地图
Mar 26 Javascript
jQuery实现轮播图效果demo
Jan 11 jQuery
javascript实现放大镜功能
Dec 09 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计算两个路径的相对路径
2013/06/14 PHP
PHP 快速排序算法详解
2014/11/10 PHP
Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式
2010/06/28 Javascript
intro.js 页面引导简单用法 分享
2013/08/06 Javascript
了不起的node.js读书笔记之node的学习总结
2014/12/22 Javascript
javascript实现左右控制无缝滚动
2014/12/31 Javascript
JavaScript使用addEventListener添加事件监听用法实例
2015/06/01 Javascript
第三章之Bootstrap 表格与按钮功能
2016/04/25 Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
2016/06/30 Javascript
Bootstrap Modal遮罩弹出层(完整版)
2016/11/21 Javascript
使用JavaScript解决网页图片拉伸问题(推荐)
2016/11/25 Javascript
简单谈谈关于 npm 5.0 的新坑
2017/06/08 Javascript
Javascript中的getter和setter初识
2017/08/17 Javascript
[js高手之路]设计模式系列课程-发布者,订阅者重构购物车的实例
2017/08/29 Javascript
Vue.js实现列表清单的操作方法
2017/11/15 Javascript
angularjs实现的购物金额计算工具示例
2018/05/08 Javascript
详解ESLint在Vue中的使用小结
2018/10/15 Javascript
小程序自定义日历效果
2018/12/29 Javascript
详解微信UnionID作用
2019/05/15 Javascript
JS数组Object.keys()方法的使用示例
2019/06/05 Javascript
javascript设计模式 ? 解释器模式原理与用法实例分析
2020/04/17 Javascript
[46:04]Liquid vs VP Supermajor决赛 BO 第四场 6.10
2018/07/05 DOTA
Python和GO语言实现的消息摘要算法示例
2015/03/10 Python
python实现计算倒数的方法
2015/07/11 Python
用python记录运行pid,并在需要时kill掉它们的实例
2017/01/16 Python
浅谈python import引入不同路径下的模块
2017/07/11 Python
Python中scatter函数参数及用法详解
2017/11/08 Python
如何使用python自带IDLE的几种方法
2020/10/10 Python
犹他州最古老的体育用品公司:Al’s
2020/12/18 全球购物
英国珠宝网站Argento: PANDORA、Olivia Burton和Nomination等
2020/05/08 全球购物
应届毕业生简历自我评价
2014/01/31 职场文书
优秀经理事迹材料
2014/02/01 职场文书
教师拔河比赛广播稿
2014/10/14 职场文书
2015年大学生社会实践评语
2015/03/26 职场文书
十个Python自动化常用操作,即拿即用
2021/05/10 Python
vue动态绑定style样式
2022/04/20 Vue.js