jquery - 禁用游标 :pointer for labels of disabled checkboxes

Question

我正在尝试 cursor:pointer在我的复选框及其标签上。

这是我使用的代码 - 但我想避免使用 cursor:pointer在复选框及其标签上 disabled .

HTML 看起来像这样:

<label>
    <input 
        type="checkbox"
        ...more attributes...
        > Yes, please specify:
</label>

CSS:

input[type=checkbox]:not([disabled]), 
label + input[type=checkbox]:not([disabled]) {
    cursor: pointer;
}

我将其设置为禁用的方式是使用 jQuery:

$("selector").prop("disabled", true);
$("selector").prop("disabled", false);

我似乎找不到选择<label>的方法包含禁用的复选框。

想法？

谢谢。

有人好心提供了codepen进行测试:http://codepen.io/8odoros/pen/BQVQGg

Answer 1

我不知道你到底需要什么，我的理解对吗你需要这个

$('button').click(function(){
var i = $('input');
    
    if ( i.is('[disabled]') ){
        i.attr('disabled',false)
    }else{
         i.attr('disabled',true);
    }
})

input[type=checkbox][disabled]{
  cursor:default;
}
input[type=checkbox]:not([disabled]) +label {
  cursor:pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<input type="checkbox" value="tasd" disabled />
<input type="text" value="text" disabled />
<button>disable/enable</button>

<input  type="checkbox" />
<label> This is enabled (pointer cursor)</label>
</br>
<input  type="checkbox"  disabled/> 
<label>This is disabled (default cursor)</label>