用jquery将复选框改成单选框
2014-02-12 08:45
134 查看
前提是要包含jquery文件。
相关代码:
html代码:
相关代码:
jQuery(function($) { init_price_checkbox("by_price"); init_price_checkbox("by_size"); }); function init_price_checkbox(id){ $("#"+id+" input[type='checkbox']").each(function(){ $(this).click(function(){ for (var i = $("#"+id+" input[type='checkbox']").length - 1; i >= 0; i--) { if($(this).index("#"+id+" input[type='checkbox']")==i) $(this).attr('checked','checked'); else $("#"+id+" input[type='checkbox']").eq(i).removeAttr('checked'); }; }); }); }
html代码:
<div id="by_price"> <form id="search_by_price" method="post" action="index.php?action=search&orderby=price"> <span class="by_words">By Price</span> <div class="p_left_columu"> <div><input type="checkbox" name="75" value="1" ><span>Under $75</span></div> <div><input type="checkbox" name="75-100" value="2" ><span>$75 - $100</span></div> <div><input type="checkbox" name="100-125" value="3" ><span>$100 - $125</span></div> </div> <div class="p_right_columu"> <div><input type="checkbox" name="125-150" value="1" ><span>$125 - $150</span></div> <div><input type="checkbox" name="150" value="2" ><span>$150 & Above</span></div> </div> <div class="search_button"><input type="image" border="0" onmouseout="this.src='/themes/diy_html5/images/crystal_by_price/price_search.png'" onmouseover="this.src='/themes/diy_html5/images/crystal_by_price/price_search_on.png'" src="/themes/diy_html5/images/crystal_by_price/price_search.png"> </div> </form> </div>
相关文章推荐
- 用jquery与css打造个性化的单选框和复选框
- jquery实现HTML复选框变单选框
- 推荐11款jQuery开发的复选框和单选框美化插件
- jQuery学习笔记 - 1 页面框架下载完毕后执行逻辑 文本框 单选框 复选框
- 利用jquery和css打造个性化的单选框和复选框
- jQuery读写复选框,文本框,单选框,textarea,img
- 【三石jQuery视频教程】02.创建 FontAwesome 复选框和单选框
- jquery边学边练1--用ul li实现单选框和复选框功能
- jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
- JQuery对单选框,复选框,下拉菜单的操作
- jquery选中单选框、复选框、下拉框
- jQuery表格应用-单选框复选框以及表格展开收缩
- jquery 操作单选框,复选框,下拉列表
- jQuery获取Select选择的Text(文本信息)和 Value属性的值,select语法解释;单选框和复选框
- js和jquery分别验证单选框、复选框、下拉框
- jQuery.HCheckbox 单选框、复选框表单美化
- js和jquery分别验证单选框、复选框、下拉框
- 总结jquery操作拉列表、文本框、复选框、单选框集合
- Jquery学习笔记:操作form表单元素之二(复选框和单选框)
- jquery获取单选框复选框下拉框值