首页 > Web开发 > 详细

用jquery将复选框改成单选框

时间:2014-02-12 15:46:51      阅读:492      评论:0      收藏:0      [点我收藏+]

前提是要包含jquery文件。

相关代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
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将复选框改成单选框

原文:http://www.cnblogs.com/share123/p/3545318.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!