1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
| <h3>type=radio 的只读问题</h3>
<form>
<div>
<div>input readonly</div>
<div>还是可以点击</div>
<label><input type="radio" name="aa" readonly >111</label>
<label><input type="radio" name="aa" readonly checked>222</label>
</div>
<div>
<div>input disabled</div>
<div>不能点击；但也不能提交</div>
<label><input type="radio" name="bb" disabled >111</label>
<label><input type="radio" name="bb" disabled checked>222</label>
</div>
<h3>我们需要的是：不能点击但要提交！</h3>
<h3>解决办法一</h3>
<div>onclick="return false</div>
<div>
<div>input onclick="return false"</div>
<div></div>
<label><input type="radio" name="cc" onclick="return false" >111</label>
<label><input type="radio" name="cc" onclick="return false" checked>222</label>
</div>
<h3>解决办法二</h3>
<div>
<div>用 css 禁止点击</div>
<label class="disabled"><input type="radio" name="dd" onclick="return false" >111</label>
<label class="disabled"><input type="radio" name="dd" onclick="return false" checked>222</label>
</div>
<button> 提交 </button>
</form>
<style type="text/css">
input[type="radio"][readonly],label.disabled {
pointer-events: none;
}
</style>
|