jQuery插件-卡在某个位置,发生事件

维巴夫

我正在尝试编写一个简单的jquery插件,在其中-它会有一个textarea或textbox和一些按钮。

单击按钮后,我需要获取相关文本区域或文本框的值。

我已经写了一些代码,但是我陷入了困境。谁能帮我这个?

这是小提琴:http : //jsfiddle.net/655wz/

(function ($) {

$.fn.widgetify = function (options) {
    var defaults = {
        multi: false
    };
    var settings = $.extend({}, defaults, options);

    return this.each(function () {
        //create all dom elements here
        this.template = $("<div class='outer' id='" + settings.id + "'>Sample Class</div>");
        this.textbox = $("<input type='text' name='sample' id='sample' />");
        this.textarea = $("<textarea name='sampletextarea' id='sampletextarea'></textarea>");
        this.go = $("<input type='button' name='" + settings.id + "_go' id='" + settings.id + "_go' value='Go' />");

        //append all dom elements here
        if (settings.multi) {
            $(this.template).append(this.textarea);
        } else {
            $(this.template).append(this.textbox);
        }
        $(this.template).append(this.go);
        $(this).append(this.template);

        //all events stuff here
        this.go.on('click', $.proxy(function () {
            //use original 'this'
            alert($(this.textarea).val());
        }, this));

        return this;
    });
}

}(jQuery));

您需要修复html,而不要重复div ID。将第二个div更改为:

<div id="example-widget-container1"></div>

其余代码看起来不错。至少就示例而言。

同样,在单击处理程序中,您将不得不根据您的settings.multi变量来提醒textarea和textbox值。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

jQuery插件-卡在某个位置,发生事件

来自分类Dev

jQuery DataTables RowReordering插件-发生更改事件?

来自分类Dev

jQuery Joyride插件-什么都没发生?

来自分类Dev

jQuery自定义事件插件

来自分类Dev

使用Struts 2 jQuery插件发布事件

来自分类Dev

jQuery插件中多次触发click事件

来自分类Dev

如何从jQuery插件中附加keyup事件

来自分类Dev

在jQuery插件中创建点击事件

来自分类Dev

从外部触发jQuery插件内的事件

来自分类Dev

jQuery自定义事件插件

来自分类Dev

jQuery插件:如何从事件访问?

来自分类Dev

jQuery插件-多个元素的onclick事件

来自分类Dev

如何使用 jquery 插件创建多个事件

来自分类Dev

如何在 jQuery 发生事件的 div 之外获取数据属性?

来自分类Dev

如何在 jQuery 发生事件的 div 之外获取数据属性?

来自分类Dev

在单个页面中的多个位置使用JQuery插件时不起作用

来自分类Dev

更改eventClick以在jquery FullCalendar插件中右键单击发生

来自分类Dev

即使发生验证错误,jQuery验证插件也会提交

来自分类Dev

Eclipse插件,弹出菜单在编辑器中的哪个位置发生了?

来自分类Dev

jQuery插件可在时间轴上显示事件

来自分类Dev

jQuery自定义插件:向事件返回值

来自分类Dev

Hammer.js与JQuery插件未触发事件

来自分类Dev

如何从使用val()的jQuery插件监听事件

来自分类Dev

Struts 2-JQuery插件:Spinner Value change事件

来自分类Dev

如何在jQuery插件中绑定此事件处理程序?

来自分类Dev

如何为元素内部JQuery插件绑定事件?

来自分类Dev

XDSoft DateTime Picker在jQuery插件中的Onchange事件上

来自分类Dev

javascript-如何延迟对on键事件的jquery validate插件的验证?

来自分类Dev

将事件从jQuery插件转发到React组件?

Related 相关文章

  1. 1

    jQuery插件-卡在某个位置,发生事件

  2. 2

    jQuery DataTables RowReordering插件-发生更改事件?

  3. 3

    jQuery Joyride插件-什么都没发生?

  4. 4

    jQuery自定义事件插件

  5. 5

    使用Struts 2 jQuery插件发布事件

  6. 6

    jQuery插件中多次触发click事件

  7. 7

    如何从jQuery插件中附加keyup事件

  8. 8

    在jQuery插件中创建点击事件

  9. 9

    从外部触发jQuery插件内的事件

  10. 10

    jQuery自定义事件插件

  11. 11

    jQuery插件:如何从事件访问?

  12. 12

    jQuery插件-多个元素的onclick事件

  13. 13

    如何使用 jquery 插件创建多个事件

  14. 14

    如何在 jQuery 发生事件的 div 之外获取数据属性?

  15. 15

    如何在 jQuery 发生事件的 div 之外获取数据属性?

  16. 16

    在单个页面中的多个位置使用JQuery插件时不起作用

  17. 17

    更改eventClick以在jquery FullCalendar插件中右键单击发生

  18. 18

    即使发生验证错误,jQuery验证插件也会提交

  19. 19

    Eclipse插件,弹出菜单在编辑器中的哪个位置发生了?

  20. 20

    jQuery插件可在时间轴上显示事件

  21. 21

    jQuery自定义插件:向事件返回值

  22. 22

    Hammer.js与JQuery插件未触发事件

  23. 23

    如何从使用val()的jQuery插件监听事件

  24. 24

    Struts 2-JQuery插件:Spinner Value change事件

  25. 25

    如何在jQuery插件中绑定此事件处理程序?

  26. 26

    如何为元素内部JQuery插件绑定事件?

  27. 27

    XDSoft DateTime Picker在jQuery插件中的Onchange事件上

  28. 28

    javascript-如何延迟对on键事件的jquery validate插件的验证?

  29. 29

    将事件从jQuery插件转发到React组件?

热门标签

归档