Question

我有一个输入单选按钮，上面绑定了两个不同的ID

<input type="radio" checked id="setProxyBtn" data-profileid="direct"/>
<label for="setProxyBtn">direct</label>
<input type="radio" checked id="setProxyBtn" data-profileid="fixed_servers"/>
<label for="setProxyBtn">fixed_servers</label>

我尝试过这种方法...

<input type="radio" checked id="setProxyBtn" data-profileid="direct"/>
<label for="direct">direct</label>
<input type="radio" id="setProxyBtn" data-profileid="fixed_servers"/>
<label for="fixed_servers">fixed_servers</label>

也尝试过这种方法...

<input type="radio" checked id="setProxyBtn" data-profileid="direct"/>
<label for="setProxyBtn direct">direct</label>
<input type="radio" id="setProxyBtn" data-profileid="fixed_servers"/>
<label for="setProxyBtn fixed_servers">fixed_servers</label>

它们似乎都不允许用户选择第二个单选按钮，有关我可能做错了什么的任何指导？

Answer 1

您是否尝试过添加allocate_and_draw属性？

name

来源：https://materializecss.com/radio-buttons.html

Answer 2

找到了解决方案，就像@light指出的那样，我对两个都使用了相同的ID。因此，我使id成为动态对象，并使用jquery来侦听尚未在DOM中的元素上的事件。

base.html代码更改为...

<input type="radio" checked id="setProxyBtn_direct" data-profileid="direct"/>
<label for="setProxyBtn">direct</label>
<input type="radio" checked id="setProxyBtn_'+profileId+'" data-profileid="'+profileId+'"/>
<label for="setProxyBtn_'+profileId+'">'+profile_desc+'</label>

base.js代码更改为...

$(document).on('click', '[id^=setProxyBtn_]', function(){

当有两个ID时，无法在MaterializeCSS中选择单选按钮

2 个答案: