ajax 를 사용하면 자바스크립트가 먹통이 됩니다.

ajax 를 사용하면 자바스크립트가 먹통이 됩니다.

QA

ajax 를 사용하면 자바스크립트가 먹통이 됩니다.

답변 2

본문

안녕하세요. 오늘도 초보는 헤매이고 있습니다.

 

 

<div id="swiper-container-place" class="swiper-container">
    <div class="swiper-wrapper rollroll">
        <img src="1.jpg" />
        <img src="2.jpg" />
        <img src="3.jpg" />
        <img src="4.jpg" />
    </div>
</div>

<script>
    var swiper = new Swiper('#swiper-container-place', {
        slidesPerView: 'auto',
        spaceBetween: 10,
    });
</script>

 

위와 같은 소스를 적용하면 스크립트가 잘 실행되고 스와이프가 잘 동작합니다.

 

그런데 아래처럼 ajax를 이용해 swiper-wrapper 부분을 불러오면 스크립트가 전혀 먹질 않습니다.

어떻게 수정해야 할까요?

 

<div id="swiper-container-place" class="swiper-container">
    <div class="swiper-wrapper rollroll"><!-- ajax_img.php 내용 들어감--></div>
</div>

<script>
    var swiper = new Swiper('#swiper-container-place', {
        slidesPerView: 'auto',
        spaceBetween: 10,
    });
</script>

<script> 
    var lat, lng;        
    $(document).ready(function(){    
    function get_placeitem(pos){ 
      if(pos =='') lat=lng='';
      else {
         lat = pos.coords.latitude;
         lng = pos.coords.longitude;
      }
     $.post("ajax_img.php","lat="+lat+"&lng="+lng, function(data){ 
        if(data.indexOf('swiper-slide') >-1 ) $(".rollroll").append(data);
     });
    }
    
    function errork(error){    get_placeitem(''); }
    if (!navigator.geolocation) get_placeitem('');
    navigator.geolocation.getCurrentPosition(get_placeitem, errork); 
    });    
</script>

 

 

크롬의 개발자 도구로 보면 <div class="swiper-wrapper rollroll">/div> 이 부분에

내용은 정상적으로 잘 들어가 있습니다.

 

 

구글에서 "ajax 페이지에서 자바스크립트" 를 검색해서 읽어 보았지만

검은 것은 글씨요 흰것은 화면이라...ㅠ_ㅠ

 

고수님들의 도움 좀 부탁드립니다.

 

 

 

이 질문에 댓글 쓰기 :

답변 2

1. 아래처럼 만들고

function swiper_fn(){

    var swiper = new Swiper('#swiper-container-place', {
        slidesPerView: 'auto',
        spaceBetween: 10,
    });

}

---------------------------------------

 if(data.indexOf('swiper-slide') >-1 ) $(".rollroll").append(data);---> 아래처럼 수정

 if(data.indexOf('swiper-slide') >-1 ){

   $(".rollroll").append(data);

   swiper_fn();

}

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
filter #ajax ×
전체 406
© SIRSOFT
현재 페이지 제일 처음으로