Question

这是我第一次使用.addClass()。
在我的项目中，我需要在虚拟电话屏幕上显示通知（iPhone的图像）。通知包含title和一些description。此title和description来自同一webpage的表单。要撰写此通知，我正在做：

var notificationText = $('#title').val().addClass('title') + plainText.addClass("description");

然而，我收到一个错误：

TypeError: $(...).val(...).addClass is not a function

我在这里做错了什么？

更新所以，按照压倒性的要求，我做了：

var notificationText = $('#title').addClass('title').val() + plainText.addClass("description");

然而，我收到一个错误：

Uncaught TypeError: Object sss has no method 'addClass'

jsFiddle

更新2：我不需要设置描述样式，因此我删除了与之相关的类。请参阅我的updated fiddle。现在问题是title中的文字变得粗体而不是#notifications中复制的文字。它没有根据CSS进行样式设计。

Answer 1

在如此短的时间内得到了很多答案...... 叹息

我收集了我认为你想要的东西。试试这个：

JSFiddle：http://jsfiddle.net/TrueBlueAussie/7b3j2/13/

$(document).ready(function(){
     CKEDITOR.replace( 'description' );

    $('#title').focus();    

    $('form').submit(function(event){
        event.preventDefault();
        var html=CKEDITOR.instances.description.getSnapshot();
        var divEle=document.createElement("DIV");
        divEle.innerHTML=html;
        var plainText=(divEle.textContent || divEle.innerText);

        var $title = $('<span></span');
        $title.addClass('title');
        $title.text($('#title').val());

        var $desc = $('<span></span');
        $desc.addClass('description');
        $desc.text(plainText);

        $('form').append($title);
        $('form').append($desc);
    });
});

你可以显然链接一些跨度操作，但我现在让它们可读。较短的版本看起来像：

    var $title = $('<span></span').addClass('title').text($('#title').val());
    var $desc = $('<span></span').addClass('description').text(plainText);
    $('form').append($title).append($desc);

正如您现在可能知道的那样，但为了完整起见，最初的错误是尝试将jQuery方法应用于string个对象的结果。此解决方案会创建新的jQuery span个对象，然后可以对其进行样式化并将其附加到表单中。

Answer 2

您正在尝试将类添加到值，这绝对不是jQuery对象

请改为尝试：

$('#title').addClass('title').val()

Answer 3

addClass只能在jQuery对象上执行并返回一个jQuery对象 - 这就是使它可链接的原因。您不能将类添加到字符串中。

所以，在这段代码中，实际上有两个错误：

1）plainText.addClass - plainText是一个字符串，而不是jQuery对象。您必须将类添加到您创建的元素（在您的情况下，divEle元素），但是，由于addClass仅适用于jQuery对象，您必须首先将div转换为jQuery元素。您可以通过执行以下操作来完成此操作：

$(divEle).addClass('description');

2）addClass返回一个jQuery对象，因此你不能用字符串连接它。

编辑：刚刚意识到您要将notificationText（字符串）附加到DOM。您必须将其转换为div并将div添加到DOM。

jsFiddle：http://jsfiddle.net/7b3j2/17/

Answer 4

要添加课程，您必须使用

$('#title').addClass('title');

如果您想获得该值，可以使用

$('#title').addClass('title').val()

Answer 5

首先尝试addClass

$('#title').addClass('title');

更新

为了使代码完全正常工作，你应该像这样分开这行。

var notificationText = $('#title').val() + ' ' + plainText;
$('#title').addClass('title');
$(plainText).addClass("description");

Fiddle

最终更新

所以我们在这里真正想做的是：

获取内容的值
将它们附加到提交并设置附加文本的样式

示例

// Get the text. var notificationText = $('#title').val() + ' ' + plainText; // Append to form. $('form').append('<span class="summary">' + notificationText + '</span>'); // CSS styling .summary { display:block; font-weight: bold; }

请参阅Fiddle

Answer 6

你犯的错误：

<div id="title"><div>
$('#title').val().addClass('title')

- ＆gt;现在$('#title').val()将提供该特定元素值。

- ＆gt; $('#title').val().addClass()您要为该值添加类。

使用此：

$('#title').addClass();

因为你不能将类添加到元素的值。

你应该将addClass添加到特定元素，因为addClass在内部会将属性类添加到该元素。所以最终解决方案变成了：

 $('#title').addClass('title').val()

Answer 7

因为你试图在class而不是element上添加class。

$('#title').val().addClass('title')  //it is wrong

将其替换为：

$('#title').addClass('title')

如果plainText不是您通过

初始化的元素对象

var plainText = $('#anotherId');

也会导致此错误。

Answer 8

考虑#title是元素的id。您可以直接向其添加类名。

$('#title').addClass('className');

其中className是该类的名称。

Answer 9

虽然addClass和val()都是jQuery对象上的方法，但val()不像addClass那样可链接。执行$('#title').val()时，如果没有返回对象，则只返回元素的字符串值。

请改用：

$('#title').addClass('title');

如果你仍然需要获得价值：

$('#title').addClass('title').val();

plaintext产生错误的原因是因为您尝试在使用addClass本机创建的DOM节点上使用jQuery document.createElement("DIV");方法。这不行。要使它工作，您需要使用jQuery定义新元素：

var divEle = $('<div></div>');

然后添加类：

divEle.addClass('description');

或使用本机classname方法将类添加到DOM节点：

divEle.className = divEle.className + " description";

.addClass（）不起作用

9 个答案:

JSFiddle：http://jsfiddle.net/TrueBlueAussie/7b3j2/13/

更新

Fiddle

最终更新

请参阅Fiddle