jquery - 单击盆景形状后显示 jquery UI 对话框

Question

你好我有这个代码

$(function() {
  bonsai.run(document.getElementById('movie'), {
   code: function() {
     var rect= new Rect(0, 0, 100, 100);
     rect.on('multi:pointerdown', function(e) {
     $("#dialog-form").dialog("open");
     });
   },
   width: 500,
   height: 400,
  });
});

当我点击我的矩形时，我有这个错误：

ReferenceError: $ 未定义

如何获得有关 jquery 的参考？

Answer 1

BonsaiJS创建一个新的执行上下文（通常是一个 web worker），并且您在其中传递的代码bonsai.run在不同的范围内执行，其中 jQuery 不可用。可以在这里找到有关 BonsaiJS 如何执行代码的详细信息。

但是要解决您的问题，您可以像这样与所谓的 BonsaiJS 运行器上下文进行通信：

$(function() {
  var movie = bonsai.run(document.getElementById('movie'), {
    // note: this function will be stringified and sent to the runner context
    code: function() {
      var rect= new Rect(0, 0, 100, 100).fill('red').addTo(stage);
      rect.on('multi:pointerdown', function(e) {
        // this is how you would pass data with your message
        stage.sendMessage('openDialog', {
          id: '#dialog-form'
        });
        // no data:
        // stage.sendMessage('openDialog', {});
      });
    },
    width: 500,
    height: 400,
  });
  movie.on('load', function() {
    movie.on('message:openDialog', function(data) {
      $(data.id).dialog("open");
    });
  });
});

Answer 2

也许您在包含 JQuery Javascript 之前调用了该函数？首先放置对 JQuery 脚本的引用。

Answer 3

• 确保 $ 变量不会被 jquery 核心中的 Jquery 变量覆盖。

• 加载脚本的顺序很重要，在 jQuery 加载之后运行脚本。