前提是要包含jquery文件。

相关代码:

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将复选框改成单选框的更多相关文章

  1. PHP下拉框内容随单选框内容变化

    这久在修改一个项目的小东西,要求把下拉框改为单选框,由于代码封闭,修改不了获取函数,所以想了个办法让下拉框的内容随单选框的内容变化,下面把代码分享给大家: <!DOCTYPE html PUBL ...

  2. jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等

    转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...

  3. 对jquery操作复选框

    摘要:jquery操作复选框.使用更简洁易懂,思路清晰,逻辑更明了,很实用 <!DOCTYPE html> <html> <head> <meta chars ...

  4. jQuery取复选框值、下拉列表里面的属性值、取单选按钮的属性值、全选按钮、JSON存储、*去空格

    1.jquery取复选框的值<!--引入jquery包--> <script src="../jquery-1.11.2.min.js"></scri ...

  5. jquery判断复选框checkbox是否被选中

    jquery判断复选框checkbox是否被选中 使用is方法 //如果选中返回true //如果未选中返回false .is(':checked');

  6. jquery判断复选框是否选中

    jquery判断复选框是否被选中 $(function(){ $(document).on("click", ".checkbox",function(){ v ...

  7. jQuery判断复选框checkbox的选中状态

    通过jQuery设置复选框为选中状态 复选框 <input type="checkbox"/> 错误代码: $("input").attr(&quo ...

  8. jquery实现复选框全选,全不选,反选中的问题

    今天试了一下用jquery选择复选框,本来以为很简单的东西却有bug,于是搜索了一下找到了解决方法. html代码如下(这里没有用任何样式,就没有再放css了): <html> <h ...

  9. jquery操作复选框(checkbox)十二技巧

    jquery操作复选框(checkbox)的12个小技巧. 1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$( ...

随机推荐

  1. java邮件

    我们用过很多邮件,qq,163,网易等. 一.发送邮件需要遵循smtp协议,接收邮件需要遵循pop3协议 二.发邮件的过程 假设用qq邮件 写邮件-->点 “发送” --> qq邮件服务器 ...

  2. tomcat 创建虚拟主机

    1. tomcat8 2. TOMCATROOT/conf/server.xml 增加<Host name="HOSTNAME" appBase="ROOTDir& ...

  3. linux系统设置静态IP 查看网卡配置文件

    http://jingyan.baidu.com/article/455a99508be7cda167277865.html vi /etc/sysconfig/network-scripts/ifc ...

  4. js控制html元素的readonly属性

    html元素假设为只读,那么其readonly="readonly",我们现在想通过js来改变readonly属性为可以输入. 初始时,两个输入框都是只读.点击change按钮后, ...

  5. 小记:xml画一个爱心。

      aixin.xml: <!-- height:width=viewportHeight:viewportWidth --> <vector xmlns:android=" ...

  6. mac 安装memcached服务

    使用homebrew安装,homebrew安装方法http://brew.sh/ 安装memcached服务 brew install memcached 配置开机启动(用brew安装之后下面会提示怎 ...

  7. addChildViewController

    http://www.cnblogs.com/zengyou/p/3386605.html //在parent view controller 中添加 child view controller Fi ...

  8. C++-理解构造函数、析构函数执行顺序

    先初始化序列中的函数调用,如果基类构造函数为非引用传递,则引起参数的拷贝构造 再: 先类内的成员构造函数(拷贝/默认),再类的构造函数:先基类,再派生类: 本文主要说明对象创建时构造函数的执行顺序,对 ...

  9. Spring中的Jdbc事务管理

    Spring提供了对事务的声明式事务管理,只需要在配置文件中做一些配置,即可把操作纳入到事务管理当中,解除了和代码的耦合. Spring声明式事务管理,核心实现就是基于Aop. Spring声明式事务 ...

  10. JQery w3school学习第一章 标签的隐藏和显示

    鄙人初学JQuery,最关键的是JQuery获取标签对象的方式 这一章学习的是点击按钮让所有标签的文字以及标签栏的位置隐藏起来,因为单纯的隐藏文字,还是会有空格和空行的影响 这里最关键的代码就是 $( ...