같은 페이지에 jQuery 각각 다른 버전 사용하기 (jQuery 버전 충돌 해소)
- bootstrap 내장 jQuery 버전과 추가구현할 기능의 jQuery 버전이 달라 충돌이 일어나 error가 발생할 경우 충돌해소 방법
그냥 아래와 같이 적용을 하면 충돌이 생겨 기존 기능에서 에러가 발생한다. (기존 적용된 기능이 안되던가 새로 추가된 기능이 안되던가)
<!-- bootstrap 내장 jquery -->
<script src="/assets/global/plugins/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
<!-- 추가할 jquery -->
<script src="/js/jquery-3.4.1.min.js"></script>
새로 적용할 jquery버전에 $.noConflict(true); 문법을 사용한다.
<script src="/js/jquery-3.4.1.min.js"></script>
<script>
var $j341 = jQuery.noConflict();
</script>
새로운 버전의 jquery를 사용하기 위해서는 아래처럼 $j341을 사용해주어야 한다.
<script>
$j341.ajax({...})
$j341("#button").click(function () {... });
</script>
각 라이브러리에 쓰인 js파일에 버전별로 j341로 바꿔야지 문제가 없이 실행 될 수있다.
(js파일 맨 밑만 수정하면 된다.)
;(function ($, window, document, undefined) {
var pluginName = "lib",
defaults = {
onDislike: null,
onLike: null,
animationRevertSpeed: 200,
animationSpeed: 400,
threshold: 1,
};
.
.
.
})($j341, window, document);
//(jquery, window, document); > ($j341, window, document);
'개발일지 > Javascript & jQuery' 카테고리의 다른 글
| [javascript] 동적으로 table 데이터 추가하기 (0) | 2020.08.26 |
|---|---|
| [Javascript] id / class / name 으로 id / class / name 값 가져오기 (0) | 2020.07.28 |
| [Javascript] table pagination (paging) (0) | 2020.06.10 |
| [Javascript] 시군구 select box (1) | 2020.05.22 |
| [Javascript] bootstrap 버튼 클릭 시 tab 추가 (0) | 2020.05.22 |
