防止單擊父類別單選按鈕

Question

我有此功能/腳本，可將復選框轉換為單選按鈕（在Categories metabox中），但是我需要稍微擴展一下功能，但不確定如何去做。

劇本：

function convert_root_cats_to_radio() {
    global $post_type;
?>
<script type="text/javascript">
jQuery("#categorychecklist>li>input").each(function(){
    this.disabled = "disabled";
});
jQuery("#categorychecklist>li>ul>li>input").each(function(){
    this.disabled = "disabled";
});
jQuery("#categorychecklist>li>label input").each(function(){
    this.type = 'radio';
});
jQuery("#categorychecklist>li>ul>li>label input").each(function(){
    this.type = 'radio';
});
// Hide the 'most used' tab
jQuery("#category-tabs li:odd").hide();
</script> <?php
}
add_action( 'admin_footer-post.php',     'convert_root_cats_to_radio' );
add_action( 'admin_footer-post-new.php', 'convert_root_cats_to_radio' );

現在需要什么：防止用戶選擇父類別。

例如，在下面顯示的圖像中，您應該能夠選擇Bandicoot以外的任何內容，因為Bandicoot是父母（有孩子）。 哦，並且可以選擇Bandicoot的子項。

因此，規則應該是：如果您是父母，則不能選擇您，但您的孩子可以。

Answer 1

取決於輸出html的外觀，您可以使用以下選項之一進行設置：

jQuery("#categorychecklist > li > ul").each(function(){
    jQuery(this).parent('li').children('label').children('input').attr('disabled', true);
});

要么：

jQuery("#categorychecklist > li > ul").each(function(){
    jQuery(this).prev('label').children('input').attr('disabled', true);
});

甚至更好的是，刪除廣播：

jQuery("#categorychecklist > li > ul").each(function(){
    jQuery(this).prev('label').children('input').remove();
});

Answer 2

請檢查腳本代碼中的注釋。

 $(function() { $('input[type=radio]').on('click', function() { //assumes that radio button > wrapped around a label > wrapped around li var liObj = $(this).parent().parent(); if (liObj != undefined && $(liObj).is('li') && $(liObj).has('ul').length > 0) { return false; } }); }) 

 ul { list-style: none; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul id='test'> <li> <label> <input type='radio' name='cat' />1</label> </li> <li> <label> <input type='radio' name='cat' />2</label> </li> <li> <label> <input type='radio' name='cat' />3</label> <ul> <li> <label> <input type='radio' name='cat' />3-1</label> </li> <li> <label> <input type='radio' name='cat' />3-2</label> <ul id='test'> <li> <label> <input type='radio' name='cat' />3-2-1</label> </li> <li> <label> <input type='radio' name='cat' />3-2-2</label> </li> </ul> </li> </ul> </li> </ul>