Jqcloud mouseenter

Question

我尝试使用Jqcloud创建一个mouseenter和mouseleave。但它不起作用。当我将鼠标移动到元素中时，云被移除，但是当我离开该区域时，它将不再出现。

var words1 = [
{text: "Word1", weight: 3},
{text: "Word2", weight: 2},
{text: "Word3", weight: 2},
{text: "Word4", weight: 2},
{text: "Word5", weight: 1},
{text: "Word6", weight: 1},
{text: "Word7", weight: 1},
];
// demo = <div>
$('#demo').jQCloud(words1, {
  width: 550,
  height: 550
});

$( "#demo" )
  .mouseenter(function() {
    $("demo").jQCloud('destroy');
    document.getElementById("demo").innerHTML = "<img src='http://imgurl.jpg' style='max-width:100%;max-height:100%;'>";
  })
  .mouseleave(function() {
    document.getElementById("demo").innerHTML = "";
    $('#demo').jQCloud(words1, {width: 550,height: 550});
  });

更新 我也尝试过.on但它不起作用

$("#demo").on('mouseleave', 'span', function() {
    console.log("leave");
    $('#demo').jQCloud(words1, {width: 550,height: 550});
  });