从复制事件处理程序到
;一个元素到另一个元素

发布于 2024-11-28 02:11:18 字数 792 浏览 6 评论 0原文

我不认为任何类似的现有问题可以回答这个问题。

我正在开发一个插件，它将把转换为具有两个切换状态的

。使用的基本思想是：

$('div .checkboxContainer').prettyBox();

插件本身的伪代码是：

$.fn.prettyBox = function(){
    return this.each(function(){
        $(this).find(':checkbox').each(function(){
           .. grab all event handlers on the current <input>
           .. create a new <div>
           .. attach all of the <input>'s event handlers to the <div>
           .. hide the <input>
           .. place the <div> where the <input> used to live
        });  
    };
};

其他提出类似问题的人一直关心复制单个事件，例如 click 处理程序。为了保持插件的灵活性，我认为我的代码循环遍历附加到输入的所有内容并将其复制过来很重要。

原文

I don't believe any similar existing questions answer this one.

I am developing a plugin that will turn <input type='checkbox' /> into a <div> with two toggle states. The basic idea for use is:

$('div .checkboxContainer').prettyBox();

The pseudo code for the plugin itself is:

$.fn.prettyBox = function(){
    return this.each(function(){
        $(this).find(':checkbox').each(function(){
           .. grab all event handlers on the current <input>
           .. create a new <div>
           .. attach all of the <input>'s event handlers to the <div>
           .. hide the <input>
           .. place the <div> where the <input> used to live
        });  
    };
};

Others who have asked similar questions have been concerned with copying single events, such as a click handler. To maintain plugin flexibility, I think it's important that my code loop through everything attached to the input and copy it over.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

腹黑女流氓 2024-12-05 02:11:18

试试这个

$.fn.prettyBox = function(){
    return this.each(function(){
        $(this).find(':checkbox').each(function(){
           //Grabs all the events
           var events = $(this).data("events");
           var $div = $("<div />");

           //Loop through all the events
           $.each(events, function(i, event) {
             //Loop through all the handlers attached for a event
             $.each(event, function(j, h) {
               //Bind the handler with the event 
               $div.bind(i, h.handler);
             });
           });

           $(this).hide().after($div);
        });  
    };
};

Try this

$.fn.prettyBox = function(){
    return this.each(function(){
        $(this).find(':checkbox').each(function(){
           //Grabs all the events
           var events = $(this).data("events");
           var $div = $("<div />");

           //Loop through all the events
           $.each(events, function(i, event) {
             //Loop through all the handlers attached for a event
             $.each(event, function(j, h) {
               //Bind the handler with the event 
               $div.bind(i, h.handler);
             });
           });

           $(this).hide().after($div);
        });  
    };
};

回复收藏 0 原文