jquery - addClass 不适用于 textarea 的特定 id

Question

我想向mceBasicEditortextarea 添加一个类，id="abcd"以便当该类出现在 textarea 标记中时，tinymce 工具栏将加载。但是，当单击复选框时，我收到警报，但在检查文本区域时，我看到该类mceBasicEditor尚未添加，也没有出现 tinymce 工具栏。

这是复选框的代码：

<form><input type="checkbox" id="mceCheck" name="mceCheck" value="1" >mce Toggle</form>

这是文本区域：

<p id="description" style=""><label style=""  class="leftLabel" >Event Description</label><textarea name="event_description" id="abcd" style="" rows="25" cols="50" class="contact  mceNoEditor "></textarea></p>

用于添加类的 Jqueru：

$('#mceCheck').click(function(){
    if($(this).attr('checked')){
        alert(1);
        $('#abcd').addClass('mceBasicEditor');
    }
    else
    {
        alert(0);
        $('#abcd').removeClass('mceBasicEditor');
    }
});

Answer 1

代替：

$(this).attr('checked')

采用：

$(this).prop('checked')

来自 jQuery 的.prop()文档：

属性和属性之间的区别在特定情况下可能很重要。在 jQuery 1.6 之前，该.attr()方法有时会在检索某些属性时考虑属性值，这可能会导致行为不一致。从 jQuery 1.6 开始，该.prop()方法提供了一种在检索属性的同时显式检索属性值的方法.attr()。

Answer 2

你可以试试这个（添加/删除class）

$(function(){
    $('#mceCheck').change(function(){
        if($(this).is(':checked')){
            $('#abcd').addClass('mceBasicEditor');
        }
        else
        {
            $('#abcd').removeClass('mceBasicEditor');
        }
    });
});

示例在这里。

更新： 另外，toggleClass会工作

$(function(){
    $('#mceCheck').change(function(){
        $('#abcd').toggleClass('mceBasicEditor');
    });
});

示例在这里。