2013-12-24 5 views
1

страница всегда предупреждает «btn2», всякий раз, когда я нажимаю btn1 или btn2. похоже, проблема вызвала «щелчок» закрытия. Но я не знаю, как его исправлять.Как исправить ошибку закрытия в моем коде jQuery

благодарит заранее.

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>untitled</title> 
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
    <script> 
     (function(){ 
      $.fn.test = function(){ 
       F.init.apply(this,arguments) 
      }; 
      var F ={ 
       that:null, 
       init:function(){ 
        F.that = this; 
        $(F.that).click(function(e) { 
         F.method(); 
        }); 
       }, 
       method:function(){ 
        var text =$(F.that).html(); 
        alert(text); 
       } 
      } 
     })(); 
     $(function(){ 
      $("#btn1").test(); //alert btn2---bug 
      $("#btn2").test(); //alert btn2 
     }); 
    </script> 
</head> 
<body> 
    <button id="btn1">btn1</button> 
    <button id="btn2">btn2</button> 
</body> 
</html> 

ответ

3

Вы ссылаетесь на свой класс объектов F под этим именем из класса.

Ваша линия F.that = this эффективно создавая тем самым то, что будет на других языках ОО считать «статический член» класса, так как #btn2 и #btn1 в конечном итоге обмена же that члена.

Кроме того, ваш обработчик кликов пытается вызвать F.method() - фактически также вызов статического метода.

Вам нужно создать объект типа F каждый раз, когда вы хотите, чтобы обернуть его вокруг элемента new. Только после этого вы получите отдельный для каждого элемента.

Я предлагаю использовать встроенную модель плагина jQuery, такую ​​как http://jqueryboilerplate.com/, вместо того, чтобы пытаться изобрести свои собственные. Смотрите этот отрывок из этого кода:

$.fn[ pluginName ] = function (options) { 
    return this.each(function() { 
     if (!$.data(this, "plugin_" + pluginName)) { 
      $.data(this, "plugin_" + pluginName, new Plugin(this, options)); 
     } 
    }); 
}; 

Обратите внимание, как он использует new Plugin создать плагин экземпляра, а затем сохраняет его на элемент, используя $.data, но только первый раз, когда плагин вызывается против каждого элемента.

0

1) Р представляет собой статический объект

2) Так F.that также статические

3) так

F.that = this 

линия будет установлен 'это', чтобы F.that. 4) первый раз, когда вы звоните

$("#btn1").test(); 

тогда F.that будет равен $ ("# btn1"); // это будет равно $ ("# btn1")

5) в следующий раз вы звоните

$("#btn2").test(); 

тогда F.that будет равен $ ("# btn2"); // это будет равно $ ("#") btn2

6) Итак, наконец, F. что вы устанавливаете $ ("# btn2")

7), следовательно, $ (F.that) .html(); по существу $ ($ ("# btn2"). HTML()), который далее так же, как $ ("# btn2"). HTML()

8) Следовательно, предупреждение показывает "btn2"

Смежные вопросы