標籤不會觸發它的輸入

我有包含A-HREF標籤標籤：標籤不會觸發它的輸入

<input id="sn_menu01_close" class="sn_menu_close" name="sn_menu" type="radio"> 

<p><label for="sn_menu01_close" class="close">angebot<a href="#angebot">Angebot und Preise</a></label></p>

當點擊該鏈接對應的單選按鈕不會觸發。當點擊鏈接之外的文字時，它就起作用了。我怎樣才能讓它爲鏈接工作呢？兩者都必須工作，觸發單選按鈕並跳到鏈接目標（錨點）。我正在尋找一個純粹的CSS解決方案，使用JavaScript或jQuery它沒有問題。

來源

2017-03-29 Sempervivum

嘗試使用jQuery的功能觸發它：

$('input[type="radio"] ~ p label a').click(function(event) { 
 
    event.preventDefault(); 
 
    var radio = $(this).parent().attr('for'); 
 
    $('#' + radio).prop("checked", true); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="sn_menu01_close" class="sn_menu_close" name="sn_menu" type="radio"> 
 

 
<p> 
 
    <label for="sn_menu01_close" class="close">angebot<a href="#angebot">Angebot und Preise</a></label> 
 
</p>

編輯的純CSS： 嘗試使用pointer-events: none禁用鏈接：

input[type="radio"] ~ p label a { 
 
    pointer-events: none 
 
}

<input id="sn_menu01_close" class="sn_menu_close" name="sn_menu" type="radio"> 
 

 
<p> 
 
    <label for="sn_menu01_close" class="close">angebot<a href="#angebot">Angebot und Preise</a></label> 
 
</p>

來源

2017-03-29 08:40:22 pblyt

感謝您的提示，但對不起，我忘了提及我正在尋找純粹的CSS解決方案。 – Sempervivum

好吧，我在我的回答中添加了純粹的css解決方案 – pblyt

只要單選按鈕被選中，它就可以工作。但不幸的是，鏈接不再活躍，它不會跳到錨點。 – Sempervivum

標籤不會觸發它的輸入

回答

相關問題