jQuery 플러그인에 인스턴스 변수 저장

Question

나는 네트워크에서 작동하는 양식의 유효성을 검사하는 플러그인을 작성했습니다. 여기서 문제는 우리 페이지 중 일부가 여러 양식을 가지고 있으며 전역 변수가 덮어 쓰기된다는 것입니다. 나는 최선을 다해 모범을 보이려고 노력할 것이다. 코드 자체가 너무 길어서 붙여 넣을 수 없습니다.

이 코드는 끔찍한 잘못 알고 있지만 너무 복잡하게하지 않고도이 코드의 여러 인스턴스를 사용하여 최상의 방법을 얻으려고합니다.

jQuery 플러그인 :

(function($){ 

    methods = { 
     'method1': function(){ 
      alert('form: ' + globals.form_name); 
     } 
    } 

    $.fn.validationplugin = function() { 
     globals.form_id = $(this).attr('id'); 
    }(jQuery); 

    var globals = {} 


}(jQuery); 

HTML 전화 :

<form id="form1"></form> 
<form id="form2"></form> 

<script type="text/javascript"> 
    $('#form1').validationplugin(); 
    $('#form2').validationplugin(); 
</script> 

Answer 1

양식의 정체성에 대한 배열을 사용

플러그인은 단일 요소 또는 여러 개의 호출 할 수

var globals = { 
    form_id: [] 
}; 

요소가 있으므로 각 요소의 ID를 얻어야합니다. 또한 함수에서 this을 반환하여 플러그인을 체인 연결할 수 있습니다.

이제

$.fn.validationplugin = function() { 
    return this.each(function(i, el){ 
    globals.form_id.push($(el).attr('id')); 
    }); 
}; 

호출에 하나 개 이상의 요소가있을 때 그것은 또한 작동합니다 :

그 함수를 호출하고 플러그인으로 반환 값을 할당하므로 또한, 당신은 마지막에 (jQuery)을 원하지 않는다

$('#form1,#form2').validationplugin(); 

신원 대신 요소에 대한 참조를 사용할 수 있다면 신원이없는 양식에도 사용할 수 있습니다.

Answer 2

동일한 요소에 대해 플러그인을 두 번 이상 호출하고 이러한 호출간에 데이터를 연결하려고한다고 가정합니다. 그렇지 않은 경우에는 "전역"이 필요하지 않습니다. @ Felix Kling이 논평에서 말했듯이 대신 지역 변수를 사용하십시오. 당신이 플러그인에 하나 이상의 호출 사이에 지속 할 수있는 데이터를 추적해야하는 경우

, 당신은 이런 식으로 작업을 수행 할 수 있습니다

(function($){ 

    var globals=[], 
     instances=[]; 

    $.fn.validationplugin = function() { 
     this.each(function() { 
      var current, 
       index = $.inArray(this,instances)); 

      if (index!==-1) { 
       current = globals[index]; 
      } else { 
       instances.push(this); 
       current = {}; 
       globals.push(current); 
      } 
      current.form_id = $(this).attr('id'); 
      ... 
     } 
    }; 
}(jQuery); 

이 각 DOM 요소와 연결된 객체를 캐시합니다 플러그인으로 전달됩니다. 후속 호출이 동일한 요소의 플러그인에 대해 수행되면 동일한 전역 객체가 해당 후속 호출에 사용됩니다.

jquery data을 사용하여 모든 DOM 요소와 데이터를 연결할 수도 있지만 직접 캐싱하는 것보다 효율성이 떨어질 수 있습니다.

Answer 3

I는 다음과 같이 그 일을 결국 ...

$.fn.validate = function(){ 

    var formnametest = $(this).attr('id'); 

    if(!($.validate.globals[ formnametest ])){ 
     globals(formnametest); 
    } 
} 

function globals(formnametemp){ 
    $.validate.globals[ formnametemp ] = { 
     'mobile': false, 
     'mobileoffset': -115, 
     'bubbleanimationtime': 500, 
     'bindblur': true, 
     'zindex': null 
    } 
} 

$.validate = { 
    globals:{} 
}; 

나는 내 기본 전역 변수의 새로운 인스턴스를 추가하고 형태와 같은 이름을 줄 것이라고 함수 전역()을 만들었습니다. 결과는 모든 기능을 통해 현재 양식의 이름을 전달해야했기 때문에 피하려고했지만 모든 것이 좋습니다. 감사합니다 @ Guffa, 당신의 의견은 내가 사물을 원근법에 집어 넣는 것을 도왔습니다. $ .validate.globals가 [currentform] .propertynamehere

는 장황한 것 같다하지만 내가 필요 정확히 결과였다 :

나중에 단순히이었다이 전역 변수 중 하나를 참조하십시오.:)