JavaScript 초기화 양식을 호출하는 효과적인 방법은 무엇입니까?

-1

하나는 동적 인 부분을 가진 폼을 가지고 있고, 초기화되어야합니다. 예 : datepickers 향상된 선택 부 토글 링 등JavaScript 초기화 양식을 호출하는 효과적인 방법은 무엇입니까?

예 표시/숨기기 조건부 요소 :

<form> 
    <input type="text" name="date"> 
    <select name="selection"></select> 
</form>

및 I는 상기 선택 소자의 일자 소자와 선택 2에 날짜 선택기를 초기화하기 원한다.

어디서 초기화 할 것인가?

내 생각 :

초기화는 글로벌 선택 축복하는 :
```
$(function() { 
    $('input[name=date]').datepicker(); 
    $('select[name=selection]').select2(); 
})`. 
```
을하지만 전체 웹에 대한 하나 개의 js 파일이 때문에,이 것은 각 페이지로드에 전체 DOM 크롤링을 주도 요소가 현재 페이지에없는 경우에도 마찬가지입니다.
어떤 종류의 조건부 선택기. 예 : HTML에서 함수 $(function() { $('input[name=date]', 'body#foo').datepicker(); })
함수 (또는 클래스 메소드)로 각 양식에 대한 초기화를 캡슐화하고, 전화 :
```
<script type="text/javascript"> 
    $(document).ready(initMyForm()); 
</script> 
```

을 <body>하고 ID를 부여하고,이 같은 내 글로벌 JS 파일 무언가에 추가

하지만 나는 더 좋은 방법이 없을 것이라고 생각하고 있습니다. 특히 다른 자바 스크립트 초기화가 필요한 여러 가지 다른 형태의 큰 프로젝트의 경우 무엇을 제안 하시겠습니까?

출처

2013-02-17 Ondrej Machulda

참고로,'.ready (initMyForm은());' –

은 같은 장소로에 넣어,'.ready (initMyForm) '해야한다 뭐든간에 동적 요소를 생성합니다. –

현재 프로젝트에서 하나의 JS 파일을 실행 중이거나 '일반'양식 설정 기능이 적합한 중간 크기 프로젝트의 경우에도 설명 된대로 함수를 사용하는 것이 적절할 수 있습니다.

함수를 작은 jQuery 플러그인으로 래핑 한 다음 예제를 참조하십시오. 따라서 전체 DOM을 실행하지 않으려면 필요에 따라 특정 선택기에서이 함수를 호출 할 수 있습니다.

;(function($){ 
    $.extend({ 
     initMyForm : function(){ 
      $(this).find('input[name=date]').datepicker(); 
      $(this).find('select[name=selection]').select2(); 
     } 
    }); 
})(jQuery);

그래서 당신이 사용할 수있는이 같은 :

$(document).ready(function(){ 
    $(body).find(form).initMyForm(); 
}); 

$("#my-form").initMyForm(); 

$(".page-content .form").initMyForm();

출처

2013-02-17 22:28:07

JavaScript 초기화 양식을 호출하는 효과적인 방법은 무엇입니까?

답변

관련 문제