更改单选按钮图像,帮助

2024-01-04

大家好。我不是一个很好的程序员,但仍然需要做一些编码。

现在我在使用 jQuery 更改单选按钮图像时遇到问题。 我已经在网上找到了这段代码,但它仍然不起作用。 它更改了单选按钮图像,但是当我尝试选择时,它仅更改第一个单选框的图片。(每次)

这是我的 HTML 代码:

   <div id="testcontent">
<div class="questions">
<div id="question0" class="question">
<span class="qutitle">asdg asdg</span>
<FIELDSET class="radios">
<label for="q_0" class="label_radio">
<input id="q_0" type="radio" name="q_0" value="2">dgasdg
</label>
<label for="q_0" class="label_radio">
<input id="q_0" type="radio" name="q_0" value="0"> sdgas 
</label>
<label for="q_0" class="label_radio">
<input id="q_0" type="radio" name="q_0" value="1">dgas 
</label>
</FIELDSET>
</div>

这是CSS。我希望我做对了。

#testcontent .label_check,
#testcontent .label_radio    { padding-left: 34px; }
#testcontent .label_radio    { background: url(radio-off.png) no-repeat; }
#testcontent .label_check    { background: url(check-off.png) no-repeat; }
#testcontent label.c_on      { background: url(check-on.png) no-repeat; }
#testcontent label.r_on      { background: url(radio-on.png) no-repeat; }
#testcontent .label_check input,
#testcontent .label_radio input  { position: absolute; left: -9999px; }

这是 jquery 代码。

 function setupLabel() {
        if ($('.label_check input').length) {
            $('.label_check').each(function(){ 
                $(this).removeClass('c_on');
            });
            $('.label_check input:checked').each(function(){ 
                $(this).parent('label').addClass('c_on');
            });                
        };
        if ($('.label_radio input').length) {
            $('.label_radio').each(function(){ 
                $(this).removeClass('r_on');
            });
            $('.label_radio input:checked').each(function(){ 
                $(this).parent('label').addClass('r_on');
            });
        };
    };
    $(document).ready(function(){
        $('.label_check, .label_radio').click(function(){
            setupLabel();
        });
        setupLabel(); 
    });

请告诉我这段代码有什么问题,非常感谢帮助。

谢谢。


我真的推荐使用jquery.uniform http://pixelmatrixdesign.com/uniform/(因为您已经在使用 jQuery 或任何同等的替代方案)来设置表单元素的样式,例如复选框、单选和选择。 它不仅仅是将图像放置在“真实”表单元素上方,例如处理标签上的点击等。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

更改单选按钮图像,帮助 的相关文章

  • Quill 公开可用的 CSS

    我最初的目的是从 PrimeFaces TextEditor 组件输出的 HTML 生成 PDF 文件 而该组件又基于 免费开源 WYSIWYG 编辑器 Quill 为此 我需要获取 TextEditor 组件生成的 HTML 将其包含在
  • 使用cheerio 检索href

    我有一个下载的 html 文件 看起来像这样 div div div div style height 11px color white font size 9px font weight bold div div style border
  • 如何在asp.net中的按钮单击事件调用之前和之后调用javascript函数

    我在 ASP NET 中创建了 ButtonClick 函数 如下所示
  • 如何让CSS选择以字符串开头的ID(不是Javascript)?

    如果 HTML 中有这样的元素 id product42 id product43 如何匹配所有以 product 开头的 id 我已经看到了完全使用 javascript 执行此操作的答案 但是如何仅使用 CSS 执行此操作 id pro
  • jQuery 变量在定义时声称它是未定义的

    我试图在同一页面上有两个自动填充文本框 一个用于手机型号 input1 一个用于固件 input2 当两者都填充时 我希望显示一个带有ID input1input2 的div 但是当在input1 中输入值时 它声称phone 的变量未定义
  • HTML 下拉菜单禁用 Javascript 中的选项

    Question 下面的代码是隐藏所选项目下拉列表中的选项 因此 当用户选择该选项时 它将隐藏所有下拉选择列表中的所选值 我现在有四个下拉选择 我想实现像当下拉选择被触发时它将启用当前选择的选项值 意味着用户能够在用户触发时选择回下拉选择中
  • 将图像编码为base64有什么效果?

    如果我将图像 jpg 或 png 转换为 base64 那么它会更大 还是具有相同的大小 会大多少呢 是否建议在我的网站上使用 Base64 编码的图像 大约会大 37 非常粗略地说 Base64 编码的二进制数据的最终大小等于原始数据大小
  • 从旧的外部 Javascript 更改 React 组件的状态?

    如何从旧的 jQuery soup 中更改 React 组件的状态 代码 我有一个这样的组件 var AComponent React createClass getInitialState function return ids rend
  • 重新创建 CSS3 过渡三次贝塞尔曲线

    在 CSS3 过渡中 您可以将计时函数指定为 cubic bezier 0 25 0 3 0 8 1 0 在该字符串中 您仅指定曲线上点 P1 和 P2 的 XY 因为 P0 和 P3 始终分别为 0 0 0 0 和 1 0 1 0 根据苹
  • Bootstrap 5 是否删除了行之间的间距?

    我开始使用 bootstrap 5 并注意到行之间没有空格 我们是否必须明确使用spacing https getbootstrap com docs 5 0 utilities spacing 实用程序喜欢mb 3 or mb 2等等试图
  • 在 Select(DropDown) 更改事件上重新初始化 Jquery DataTable

    我正在使用 Jquery UI DataTable 它被填充select DropDown change事件 在PageLoad没关系 当我表演时dropdown change event DataTable is Reinitialize
  • div 中的文本字符有限,添加“阅读更多”链接并在单击链接时显示所有字符

    我有一个 div 里面有文本 使用 PHP 和 MySQL 显示 结构如下 div class description p Here is a lot of text p div 我想在 p 标签内的文本超过 100 个字符时显示 阅读更多
  • 您可以将现有的 div 复制到模式对话框吗

    我有一个带有多个面板的仪表板来显示不同的信息 我希望能够添加一个按钮来以模式显示面板 我正在使用引导程序 我所能找到的只是已经编写的模态 我想复制作为面板的 div 标签的内容 然后将其显示在模型中 但我不确定如何进行 该面板的 html
  • 如何在php中使用一张图像绘制形状

    我需要使用图像的一部分来创建帧图像 例如 用户将从后端上传图像片段 现在我需要根据前端用户的要求在前端创建一个框架 用户将选择框架的高度和宽度 然后他将选择该图像片段 如下所示 我没有办法做到这一点 我尝试通过 css 和 html can
  • jQuery 中的 $('') 与 $('')

    我看到人们以两种不同的方式在 jQuery 中创建 HTML 元素
  • 如何防止弹性项目高度因其内容而溢出[重复]

    这个问题在这里已经有答案了 我刚刚开始学习 Flex 到目前为止我印象深刻 但是 我对包含页眉 页脚和三列的全页应用程序遇到了问题 第一列包含一个项目列表 由于我无法为其父级设置固定高度 因此每次列表增长时 它都会将页脚向下推 这是一个带有
  • jQuery 悬停时滚动到 div 并返回到第一个元素

    我基本上有一个具有设定尺寸的 div 和overflow hidden 该 div 包含 7 个子 div 但一次只显示一个 我希望当它们各自的链接悬停时能够平滑地垂直滚动 但是 第一部分 div 没有链接 并且是没有悬停链接时的默认部分
  • 没有类的 CSS 选择器

    我正在使用选择器来选择不具有一个类的所有元素 list th not foo some rules 我怎样才能将其应用到多个班级 list th not foo list th not bar some rules 上面的 CSS 当然不会
  • 在 Bootstrap 中使用 CakePHP 时如何修改包装器 div 错误类

    我在用着Bootstrap 3 0RC1 with CakePHP 2 3 6 尝试利用那些漂亮的课程 例如has error and has warning for 验证状态 http getbootstrap com css forms
  • JQuery 删除和内存泄漏

    我正在开发一个游戏 我看到了很多内存消耗 我使用jquery animate 动画完成后 我 remove 元素 我的问题是 从 dom 树中删除一个元素后 对象还存在记忆中吗 Javascript 是一种垃圾收集语言 这意味着当没有代码保

随机推荐

  • 使用 Logback SizeAndTimeBasedFNATP 时如何限制每天的文件数量

    使用Logback SizeAndTimeBasedFNATP触发策略时 如何限制每天的文件数量 例如 在任何一天 我都不希望拥有超过 100MB 的日志 鉴于每个日志 在下面的示例中 为 20MB 我希望能够将每天的最大限制设置为 5 个
  • 如何在下拉列表中选择完整的日历月份和年份

    我有一个完整的日历 我需要在下拉列表中显示它的月份和年份 我知道这个问题已经被问过 但仍然没有得到解答 我是完整日历的新手 据我所知 它现在已更新 希望有一些最简单的方法来实现 而不是给它 gotodate 选项 我已经为日历创建了代码笔
  • 在 WebForms 应用程序中验证AntiForgeryToken

    我已经阅读了一些有关使用的内容ValidateAntiForgeryToken防止 XSRF CSRF 攻击 然而我所看到的似乎只与 MVC 有关 这些是我看过的文章 ValidateAntiForgeryToken 目的 解释和示例 ht
  • 禁用整个页面的 UpdateProgress

    我已经检查过这个解决方案 有没有办法禁用某些异步回发的 UpdateProgress https stackoverflow com questions 6299072 is there a way to disable updatepro
  • Jenkins 工作流程:如何获取或设置步骤 ID

    我们想引用 Jenkins 工作流程并行任务中的一个步骤 但似乎对于多个并行任务中的步骤创建的步骤 ID 是不确定的 对于输入步骤 可以手动指定步骤 ID 是否可以为 shell 步骤指定步骤 id 或查询步骤 id 目的是我们希望在并行任
  • 使用 jquery 和 canvas 从 html 元素 id 到另一个 html 元素绘制线条

    html和jquery是否可以只通过引用元素id来画一条线 我在文本中有一个重要的单词 并且想在该单词和描述它的图像之间画一条线 我已经看到可以使用画布在元素之间进行绘制 但它们的样式位置设置为绝对 由于我的元素是文本中的单词 因此我无法将
  • Windows 运行时组件中无法继承?

    设想 我的 Windows 运行时组件项目中有 3 个类 A B C class A public sealed class B A public sealed class C A 编译上面的代码 我得到以下内容error 可访问性不一致
  • 如何检查 pandas 数据框中的字符串值序列并输出后续内容

    我正在尝试检查数据框中 B B B 的顺序 d A A B C D B B B A A E F B B B F A A testdf pd DataFrame data d array seq pd Series B B B for i i
  • 为什么 cerr 输出比 cout 快?

    使用 cout 需要多一点时间来输出语句 这对我来说不太好 但是当使用 cerr 时 输出速度更快 为什么 只是想帮忙 cout gt 常规输出 控制台输出 cerr gt 错误输出 控制台错误 cout 是缓冲的 而 cerr 不是 因此
  • 在 MYSQL 搜索中使用 URL 参数

    我正在尝试为产品建立一个搜索页面 其中我有两个表产品和库存 我在产品中有我的产品详细信息 在库存中有库存详细信息 如颜色 尺寸 价格等 请提出一个解决方案 我真的陷入困境 我需要一个更好的解决方案来实现强大的设计 以下是所有必要的详细信息
  • Spring RMI 远程注解配置

    我已经为此寻找了一段时间 但似乎找不到答案 我正在使用 Spring RMI 远程处理 并且我想使用注释配置 这可能吗 据我所知 spring 没有基于标准注释的 RMI 支持 我碰到这个链接 http rpgkan blogspot in
  • 如何以编程方式向 contentPlaceHolder 添加内容?

    我有一个母版页 我的所有页面都继承它 对于格式设置 我想将一页与另一页不同的内容放置在 ContentPlaceHolder 中 现在 我怎样才能将所有内容插入其中 由于我计划用数据库中的内容填充 ContentPlaceHolder 我想
  • Spring 中的拦截器与方面?

    我正在尝试在 Spring 中使用拦截器 我想在某些方法上实现拦截器 以在调用这些方法时处理特定逻辑 我还想不使用 Web 框架 因为我倾向于使用 Spring 作为后端 而不使用任何标头 经过搜索 我认为 spring 方法称为方面 您能
  • git 仅从一个分支删除文件

    当我从一个分支删除文件时 它会从所有分支中删除 我能做些什么 使用 git 删除文件并保留该项目状态时 git commit 它只会在该提交及其子项中被删除 说 在该分支中 当将该分支合并到另一个分支时 该文件很可能会被删除 除非在另一个分
  • 如何导出共享案例类的属性

    我正在尝试在服务器和客户端之间共享案例类 我在两端都使用了 upickle 对象及其数据在两端都可以很好地使用 共享类 case class Foo var id Long var title Description 但是我需要在客户端导出
  • 在 iOS 设备上尝试时 Flutter 签名无效

    TL DR 编辑 2020 05 06 我的应用程序从 iOS 13 4 开始正确安装 但一段时间后应用程序在启动时崩溃 我必须重新安装它 我不知道为什么 也许是在 iOS 更新之后 另请参阅下面的答案 https stackoverflo
  • 如何从 python 3.5 脚本创建独立的可执行文件?

    大多数可用程序仅支持 python 版本 3 4 您可以使用py安装程序 http www pyinstaller org支持Python 3 5 要使用 pip 安装它 请在终端中执行 pip install pyinstaller 要制
  • Javascript 匹配在 IE 中不起作用

    我有以下代码 function rgb2hex rgb rgb rgb match rgb d s d s d return hex rgb 1 hex rgb 2 hex rgb 3 似乎在 FF 和 Chrome 中工作正常 IE 给出
  • MavengeneratePackage用于从模式定义生成类的wsdl

    我正在使用 Java14 和 Spring Boot 我需要基于 wsdl 生成一些 Java 类 然而 它正在生成 它将所有生成的类放在平面结构中 而不是放在 wsdl 中指定的包中 如果有人可以提供一些建议 我将不胜感激 更多细节 PO
  • 更改单选按钮图像,帮助

    大家好 我不是一个很好的程序员 但仍然需要做一些编码 现在我在使用 jQuery 更改单选按钮图像时遇到问题 我已经在网上找到了这段代码 但它仍然不起作用 它更改了单选按钮图像 但是当我尝试选择时 它仅更改第一个单选框的图片 每次 这是我的