欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页  >  web前端

JavaScript使用Ajax进行CheckBox复选框的动态加载

程序员文章站 2022-03-17 11:28:44
...
本文通过实例代码给大家介绍了JavaScript 通过Ajax 动态加载CheckBox复选框的方法，需要的朋友参考下吧

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

<html>
 <head></head>
 <body>
  <pre name="code" class="html">

<p class="controls" id="compareyear"> 

</p></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 = &quot; 
  <label class="control-label">选择对比年限：</label>&quot;; $.ajax({ type: &quot;GET&quot;, //默认是GET url: '@Url.Action(&quot;*********&quot;, &quot;*****&quot;)', data: &quot;stationName=&quot; + name, async: false, //同步 cache: false, //不加载缓存 success: function (obj) {//后台传来的数据：&quot;2010,2011,2012,2013,2014,2015&quot; var yearArray = new Array(); yearArray = obj.split(&quot;,&quot;); for (var i = 0; i &lt; yearArray.length; i++) { if (i &lt; yearArray.length - 3) { str += &quot;
  <label><input type="checkbox" name="checkbox" value="&quot; + yearArray[i] + &quot;" />&quot; + yearArray[i] + &quot; </label>&quot;; } else {//后三个年份默认选中 str += &quot;
  <label><input type="checkbox" name="checkbox" value="&quot; + yearArray[i] + &quot;" checked="checked" />&quot; + yearArray[i] + &quot; </label>&quot;; } } $(&quot;#compareyear&quot;).html(str); }, error: function () { alert(&quot;对比年限加载失败&quot;); } }); } 
  <pre></pre> 
  <pre></pre> 
 </body>
</html>

以上就是JavaScript使用Ajax进行CheckBox复选框的动态加载的详细内容，更多请关注其它相关文章！

相关标签： JavaScript CheckBox Ajax

上一篇： 实例详解基于DOM之empty和remove的区别

下一篇： 实例分享JQuery 选择器、DOM节点操作练习

推荐阅读