jQuery css（）on。（'click'…不起作用

Question

这是我的JQuery代码：

$(document).ready(function () {
    $("ul.navbar").on("click", "li", function() {
        $(this).find("h2").css("color: pink");
        alert($(this).text());
        alert($(this).find("h2").text());
    });
});

单击可以正确生成警报，但是文本的颜色不会改变。 我也尝试过.addClass() ，这也不起作用。 有任何想法吗？ 我细读了许多其他类似的问题，但没有发现它们有帮助，我是Java语言的真正新手，但仍然受困。

Answer 1

您使用的.css()错误-

应该是这样-

$(this).find("h2").css("color","pink");

API ---> http://api.jquery.com/css/

Answer 2

更改此：

$(this).find("h2").css("color: pink");

对此：

$(this).find("h2").css("color", "pink");

Answer 3

jQuery css函数有两个参数，您使用不正确。

正确的参数如下

$(this).find("h2").css("color" ,"pink");

Answer 4

或这个：

$(this).find("h2").css( {color: "pink" } );

Answer 5

jQuery的CSS函数采用两种样式的参数：

• 作为单个名称/值对：

   .css('stylename' , 'value') 

  函数调用中的两个参数，因此用逗号分隔。

  ...在这种情况下，您的代码如下所示：

   .css('color', 'pink')` 

  注意：这两个参数都是字符串，因此必须用引号引起来。 使用单引号还是双引号都没关系。

• 作为包含多个名称/值对的对象：

   .css({'stylename':'value' , 'stylename':'value' , etc}) 

  一个参数，但定义为对象，因此用花括号括起来； 每个名称/值之间用冒号隔开； 每对名称/值之间用逗号分隔。

  ...在这种情况下，您的代码如下所示：

   .css({'color': 'pink'})` 

  和以前一样，单引号或双引号无关紧要，但是请注意，由于这是一个对象结构，因此样式名称周围的引号是可选的（尽管并非在所有情况下都如此，因此最好始终使用它们） 。

第一种语法最初是唯一可用的语法。 后一种语法是在更高版本的jQuery中添加的，以允许在一个调用中设置多个样式。

如果仅更改单个样式值，则使用哪种语法都没有关系。 如果您一次要更改一个以上的样式，那么显然最好使用第二种语法，而不是使用第一种进行多次调用。

Answer 6

您的代码似乎对我有用：

$(document).ready(function () {
    $("ul.navbar").on("click", "li", function() {
        $(this).find("h2").css("color","pink");
        alert($(this).text());
        alert($(this).find("h2").text());
    });
});

jsFiddle

您正在使用哪个jQuery？