Question

我正在网站上工作，我需要在用户点击它们时更改某些对象。就像用户点击一个盒子一样，它的颜色会被改变，我使用下面的代码，但它不起作用，有什么建议吗？

＆＃13;

var divdbl = $( "div:first" );
divdbl.dblclick(function() {
  divdbl.toggleClass( "dbl" );
});

＆＃13;

div {
    background: blue;
    color: white;
    height: 100px;
    width: 150px;
 }
  div.dbl {
    background: yellow;
    color: black;
  }

＆＃13;

<div></div>
<span>Double click the block</span>

＆＃13;

Answer 1

您的代码运行正常。只是忘了包含jQuery库。在代码片段中包含jQuery库，通过在第一个选择下拉列表中选择jQuery版本来使其工作：

var divdbl = $( "div:first" );
divdbl.dblclick(function() {
  divdbl.toggleClass( "dbl" );
});

div {
    background: blue;
    color: white;
    height: 100px;
    width: 150px;
 }
  div.dbl {
    background: yellow;
    color: black;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>
<span>Double click the block</span>

Answer 2

您必须在您的html代码中包含jquery库。还将jquery脚本放在$(function(){...});块中，这将确保DOM已准备好并将事件处理程序应用于指定的元素。

＆＃13;

$(function(){
var divdbl = $( "div:first" );
    divdbl.dblclick(function() {
      divdbl.toggleClass( "dbl" );
    });
 });

＆＃13;

    div {
        background: blue;
        color: white;
        height: 100px;
        width: 150px;
     }
      div.dbl {
        background: yellow;
        color: black;
      }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div></div>
    <span>Double click the block</span>

＆＃13;

我正在使用jquery并且我的事件处理程序没有被调用

2 个答案: