Question

我正在尝试为HTML文件中的div元素生成一个简单的颜色更改。它对我不起作用，附带的小提琴是不起作用的样本。

HTML

<div class="pagewrap"></div>
<div class="sidebar"></div> <!--Sidebar container-->   
<div class="mainbody"></div> <!--Main Body container-->

CSS

.sidebar {
    float: left;
    background-color: yellow;
    width: 10%;
    height: 100%;
    position: fixed;

}

的jQuery

$( document ).ready(function() {
    $(".sidebar").click(function() {
        $(this).css("background-color","black");
    });
});

Answer 1

您的代码无效，因为 jquery库未加载。为此，您可以打开小提琴，然后在小提琴中的 javascript 部分：选择javascript切换并设置 FRAMEWORKS＆amp;扩展到jquery 3.2.1和tadaaaaa！你的代码运作良好

Answer 2

您需要为某些代码包含结束括号和结束div。

<div class="pagewrap"><!--Everything container-->
  <div class="sidebar"></div> <!--Sidebar container-->   
  <div class="mainbody"></div><!--Main Body container-->
</div>

.sidebar {
  float: left;
  background-color: yellow;
  width: 10%;
  height: 100%;
  position: fixed; 
}

其次，您忘了将JQuery作为一个库包含在您的小提琴中。所以它无法找到变量。

更新了小提琴：https://jsfiddle.net/11632r3m/7/

jQuery脚本没有加载？

2 个答案: