單擊標籤時停止單選按鈕被選中

Question

我在Qualtrics中編寫調查代碼，出於各種原因，我手動爲特定問題創建單選按鈕。我看到的問題是，由於我創建的單選按鈕放置在Qualtrics的框架中，因此它們位於我無法控制的標籤內。

下面是一個例子

<label> 
<p>Clicking also selects the first button, but it shouldn't</p> 
<label><p>Click this to select 1st button<input type="radio" name="c" id="a"></p></label> 
<label><p>Click this to select 2nd button<input type="radio" name="c" id="b"></p></label> 
</label> 

點擊該超標籤的部分結束默認選擇第一個單選按鈕。有沒有辦法，也許使用屬性或什麼，我可以阻止這種行爲？如果單擊內部標籤，我只想選擇單選按鈕。同樣，我不控制與外部標籤相關的html，只控制內部標籤。

謝謝！

Answer 1

一個可以工作的快速入侵方法是在單選按鈕上方創建一個隱藏的輸入，以便點擊外部標籤將集中在那裏。這絕對是一個黑客，但你的用例很奇怪。

https://jsfiddle.net/42qLgq75/

HTML：

<label> 
<p>Clicking also selects the first button, but it shouldn't</p> 
<input class='hiddenInput' id="a"> 
<label><p>Click this to select 1st button<input type="radio" name="c" id="a"></p></label> 
<label><p>Click this to select 2nd button<input type="radio" name="c" id="b"></p></label> 
</label> 

CSS： .hiddenInput { 顯示：無; }