gpt4 book ai didi

jquery - 标签触发单击功能两次

转载 作者:行者123 更新时间:2023-12-01 07:02:47 24 4
gpt4 key购买 nike

有什么方法可以通过单击标签来调用函数并同时保存单选按钮的效果吗?

示例(我需要通过单击单选按钮的标签来打开/关闭带有复选框的字段集)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Click on Label</title>
<script src="/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
accordionOptions();
});

function accordionOptions(){
$("label.legend, label.childless").click( function(event){
var opposites = $(".subtype").not($(this).next());
var el = $(this);
opposites.find("input:checked").attr('checked', false);
opposites.removeClass("expanded");
el.siblings("label").removeClass("expanded");
el.next(".subtype").toggleClass("expanded");
el.toggleClass("expanded");
});
}
</script>
<style type="text/css">
<!--
HTML { text-align: center}
BODY { background: #FFF; color: #494949; font: .813em/140% Arial, Helvetica, sans-serif; text-align: left; margin: 4em auto; width: 240px}
LABEL { display: block; margin-bottom: .6em}
.subtype { display: none}
.expanded { display: block !important}
.label.expanded { /*styling selected fieldset heading*/}
-->
</style>
</head>

<body>
<form action="" method="post">
<fieldset>
<label class="legend expanded"><input name="rb_item" type="radio" value="" checked="checked" />Item 0100</label>
<fieldset class="subtype expanded">
<label><input name="item01" type="checkbox" value="" />Item 0101</label>
<label><input name="item01" type="checkbox" value="" />Item 0102</label>
</fieldset>
<label class="childless"><input name="rb_item" type="radio" value="" />Item 0200</label>
<label class="legend"><input name="rb_item" type="radio" value="" />Item 0300</label>
<fieldset class="subtype">
<label><input name="item03" type="checkbox" value="" />Item 0301</label>
<label><input name="item03" type="checkbox" value="" />Item 0302</label>
</fieldset>
<button type="submit">Submit</button>
</fieldset>
</form>
</body>
</html>

最佳答案

e.preventDefault(); 的问题是它阻止标签点击检查单选按钮。

更好的解决方案是简单地添加“已检查”快速检查,如下所示:

$("label").click(function(e){
var rbtn = $(this).find("input");
if(rbtn.is(':checked')){
**All the code you want to have happen on click**
}
)};

关于jquery - 标签触发单击功能两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1224182/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com