当前位置: 58彩票app下载 > 计算机网络 > 正文

打包下载

时间:2019-09-18 11:14来源:计算机网络
效果图:   HTML: 复制代码 代码如下: div id="chklist" style="padding:10px; font-size:14px; " input type="checkbox" value='1'/labelaaaaaa/label input type="checkbox" value='2'/labelbbbbbb/label input type="checkbox" value='3'/label

效果图:
图片 1 
HTML:

复制代码 代码如下:

<div id="chklist" style="padding:10px; font-size:14px; ">
<input type="checkbox" value='1' /><label>aaaaaa</label>
<input type="checkbox" value='2' /><label>bbbbbb</label>
<input type="checkbox" value='3' /><label>ccccc</label>
<input type="checkbox" value='4' /><label>ddddd</label>
</div>
<div id="radiolist" style="padding:10px; font-size:14px; ">
<input name='r' type="radio" value='11' /><label>AAAAAA</label>
<input name='r' type="radio" value='21' /><label>BBBBBBBB</label>
<input name='r' type="radio" value='31' /><label>CCCCCC</label>
<input name='r' type="radio" value='41' /><label>DDDDDD</label>
</div>

JS:

复制代码 代码如下:

$(function(){
$('#chklist').hcheckbox();
$('#radiolist').hradio();
$('#btnOK').click(function(){
var checkedValues = new Array();
$('#chklist :checkbox').each(function(){
if($(this).is(':checked'))
{
checkedValues.push($(this).val());
}
});
alert(checkedValues.join(','));
alert($('#radiolist :checked').val());
})
});

引进jquery文件是必须的
再有八个是 checkbox 的插件JS文件 jquery-hcheckbox.js, 在下载的压缩包中有 源文件 和 DEMO
即使在此基础上你做出了越来越美的请通告自己哦~~
示范地址
打包下载地址

您可能感兴趣的稿子:

  • input:checkbox多选框达成单选效果跟radio一样
  • jQuery获取Radio,CheckBox采纳的Value值(示例代码)
  • Jquery 改换radio/checkbox选中状态,获取选中的值(示例代码)
  • android RadioButton和CheckBox组件的选拔方法
  • 用RadioButten或CheckBox实现div的彰显与遮蔽
  • JQuery触发radio或checkbox的change事件
  • 纯JS构建网页中checkbox和radio的美化效果

编辑:计算机网络 本文来源:打包下载

关键词: