Question

代码有什么问题，这可能是我不注意的愚蠢行为。

<li><img src="images/red.gif" id="set"
onclick="document.getElementById("set").css("background-color","red")></li>

Answer 1

您在属性值中使用双引号。在值中使用双引号作为属性和单引号：

onclick="document.getElementById('bla')"

另外，不要忘记关闭双引号。

Answer 2

.css()函数仅适用于jQuery对象。

<li><img src="images/red.gif" id="set" onclick="$('#set').css('background-color', 'red');"></li>

您还需要注意报价。我用双引号包装了onclick值，并在值中使用了单引号。

Answer 3

你可以这样做：

＆＃13;

$(function() {


	$('#set').on('click', function(e) {
  	$(this).css('background-color','red');
  });


});

＆＃13;

img {
  display: block;
  width: 100%;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>
  <img src="images/red.gif" id="set" >
</li>

＆＃13;

请记住document.getElementById(...).css is not a function，所以请改用jquery代码！希望这有帮助！

Answer 4

.css方法只能用于jquery。如果你想使用javascript，你必须使用.style方法：

＆＃13;

    <li>
      <img src="images/red.gif" id="set" onclick="document.getElementById('set').style.backgroundcolor = 'red'"></li>

＆＃13;

Answer 5

代码有什么问题？

两个人认为：

您有引号问题（double qoutes中的双引号），以避免您使用单引号'：

<li.... onclick='document.getElementById("set").css("background-color","red")'></li>
________________^____________________________________________________________^

您正试图在javascript对象上访问jQuery方法.css()但这不起作用，请改用jQuery对象：
```
<li.... onclick='$("#set").css("background-color","red")'></li>
_________________^^^^^^^^^
```

注意：我建议使用jQuery以更有效的方式避免使用内联事件onclick和攻击点击事件：

JS：

$(function() {
    $('#set').on('click', function() {
        $(this).css('background-color', 'red');
    });
});

HTML：

<li>
    <img id='set' src='images/red.gif'/>
</li>

希望这有帮助。

使用jquery改变颜色

5 个答案: