在jQuery插件中創建點擊事件

Question

我想做一個簡單的插件來顯示警告，如果類是由一個jQuery插件綁定。

下面是我的html代碼

 <html>
 <head>
 <script src="js/modal-load.js"></script>
 <script>
  $(document).ready(function(){
      $('.modal-link').modalLoad();
  })
 </script>
 </head>
 ....
 <body>
      <div class="hblock-1 text-4 text__uppercase color-7">
            <a class="login btn btn-primary modal-link" href="/login-modal.php" data-toggle="modal" data-target="#login-modal">Log in</a>
            <a href="index.html#" class="register btn btn-primary modal-link">Register</a>
      </div>
 </body>

這是我的插件腳本

 (function($){

     $.modalLoad = function(element, options){

         var defaults = {
             foo: 'bar',
             onFoo: function() {}
         }

         var plugin = this;

         plugin.settings = {};

         var $element = $(element),
             element = element;

         plugin.init = function(){
             plugin.settings = $.extend({},defaults, options);
             plugin.add_bindings();
         }


         plugin.add_bindings = function(){
             this.click(function(){
                 alert('a');
             })
         }

         plugin.create_modal = function(){
             $('body').append('<div class="modal-wrapper"></div>');
         }

         plugin.init();

     }

     $.fn.modalLoad = function(options){

         return this.each(function(){
             if(undefined == $(this).data('modalLoad')){
                 var plugin = new $.modalLoad(this, options);
                 $(this).data('modalLoad', plugin);
             }
         });

     }

 })(jQuery);

在html代碼中，我已經初始化了modalLoad插件。 但是當我綁定的特定類時，它不會被click事件觸發。

我的代碼有什么問題？ add_bindings部分中的DOM選擇器有什么錯誤嗎？

謝謝前進

*編輯

Answer 1

您需要將點擊處理程序附加到$element而不是this 。 里面add_bindings ， this指的是插件對象不點擊的元素，以便this不會有一個名為方法on （你應該得到這樣的錯誤Uncaught TypeError: undefined is not a function在您的控制台）

    plugin.add_bindings = function () {
        $element.click(function (e) {
            alert('a');
            e.preventDefault()
        })
    }

演示：小提琴

在jQuery插件中創建點擊事件

問題描述

1 個解決方案

解決方案1
2 已采納 2015-03-23 07:09:31

在jQuery插件中創建點擊事件

問題描述

1 個解決方案

解決方案1 2 已采納 2015-03-23 07:09:31

解決方案1
2 已采納 2015-03-23 07:09:31