如何在jquery中创建自定义事件? [英] How to create a custom event in jquery?

问题描述

如何在jquery中创建自定义事件?我想创建一个选择绘制事件.这样我就可以用我的插件替换 JQuery图像注释上的添加注释按钮.事件.我希望能够像绘制矩形选择区域一样直接绘制注释，该怎么办?请指导.

How can I create a custom event in jquery? I want to create a selection draw event. so that I can replace the add note button on this plugin JQuery Image Annotation with my event. I want to be able to directly draw an annotation just like we draw a rectangular selection area, How can I do this? please guide.

我已经在做，但是我的问题是我不知道如何定义我想调用ondraw的自定义事件，我的意思是我想知道的是，如何定义基本的jquery事件?任何骨架或示例都绝对会有所帮助，对我来说是新手，因此我需要一些指导，而且我发现了一段创建矩形的代码， 代码:

I' already doing it but my problem is I don't know how to define my custom event which i'd like to call ondraw, i mean what i want to know is, how a basic jquery event is defined? Any skeleton or example would definitly help, and im a novice so i need a bit of guidance, also i found a piece of code to create rectangles, code:

     $(function(){
var $container = $('#container');
var $selection = $('<div>').addClass('selection-box');

$container.on('mousedown', function(e) {
    var click_y = e.pageY;
    var click_x = e.pageX;

    $selection.css({
      'top':    click_y,
      'left':   click_x,
      'width':  0,
      'height': 0
    });
    $selection.appendTo($container);
    $container.on('mousemove', function(e) {
        var move_x = e.pageX,
            move_y = e.pageY,
            width  = Math.abs(move_x - click_x),
            height = Math.abs(move_y - click_y);

        $selection.css({
            'width':  width,
            'height': height
        });
        if (move_x < click_x) { //mouse moving left instead of right
            $selection.css({
                'left': click_x - width
            });
        }
        if (move_y < click_y) { //mouse moving up instead of down
            $selection.css({
                'top': click_y - height
            });
        }
    }).on('mouseup', function(e) {
        $container.off('mousemove');
        $selection.remove();
    });
});

});

推荐答案

看看触发和绑定

Have a look at triggering and binding here. Trigger an event in your code

// Trigger event on selection draw
$(document).trigger('onSelectionDraw')

然后绑定到事件

$(document).bind('onSelectionDraw', function() {
    // do stuff
});

这篇关于如何在jquery中创建自定义事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！