javascript - 如何在动态创建的div上委派mousedown和mouseup？

rollmark是动态创建的，因此我需要将事件委托给document

尝试在按下rollmark时执行一项操作，在释放鼠标时执行另一项操作，但出现语法错误。

请帮助。

$(document).on({'mousedown', '.rollmark' function(e){
    console.log('down');
},
mouseup: function(){
    console.log('up');
}
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class='rollmark'>CLICK</div>

最佳答案

我想如果需要事件委托，则需要分别为每个处理程序分别调用.on：

$(document)
  .on('mousedown', '.rollmark', function(e) {
    console.log('down');
  })
  .on('mouseup', '.rollmark', function() {
    console.log('up');
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class='rollmark'>CLICK</div>