2013-03-26 2 views
0

JQM 아약스로드를 통해 페이지가로드 된 후 실행되도록 얻으려고하는 자바 스크립트 함수가 있습니다. 지금 나는 이것을 토론하는 다른 포스트를 보았지만 나의 문제를 해결할 수 없었다. DOM을 변경 한 후에도 인덱스가로드 될 것이라고 생각할 때 초기에로드 된 스크립트가 있지만 아직 아무것도 수행하지 않습니다. 스크립트를 heres. 나는이 문제를 알고 표준 <script> 태그를 사용하여로드 해요
아약스로드 후 자바 스크립트를 실행

$(function(){ 
    var $product = $('#product'), 
     $imgs = $product.find(".child"), 
     imageTotal = $imgs.length - 1, 
     clicked = false, 
     widthStep = 20, 
     currPos, 
     currImg = 0, 
     lastImg = 0; 
    $imgs.bind('mousedown', function (e) { 
     e.preventDefault(); // prevent dragging images 
    }) 
     .filter(':gt(0)').addClass('notseen'); 

    $product.bind('mousedown touchstart', function (e) { 
     if (e.type == "touchstart") { 
      currPos = window.event.touches[0].pageX; 
     } else { 
      currPos = e.pageX; 
     } 
     clicked = true; 

    }); 
    $(this) 
     .bind('mouseup touchend', function() { 
     clicked = false; 
    }) 
     .bind('mousemove touchmove', function (e) { 
     if (clicked) { 
      var pageX; 
      if (e.type == "touchmove") { 
       pageX = window.event.targetTouches[0].pageX; 
      } else { 
       pageX = e.pageX; 
      } 
      widthStep = 20; 
      if (Math.abs(currPos - pageX) >= widthStep) { 
       if (currPos - pageX >= widthStep) { 
        currImg++; 
        if (currImg > imageTotal) { 
        currImg = 0;} 
       } else { 
        currImg--; 
        if (currImg < 1) { 
         currImg = imageTotal; 
        } 
       } 
       currPos = pageX; 
       $imgs.eq(lastImg).addClass('notseen'); 
       $imgs.eq(currImg).removeClass('notseen'); 
       lastImg = currImg; 
       // $obj.html('<img src="' + aImages[options.currImg] + '" />'); 
      } 
     } 
    }); 
}); 

document.addEventListener('touchmove', function(e) { e.preventDefault(); }, false);// JavaScript Document 

, 나는 그것을 해결하는 방법 단지 모르겠어요. 당신이 jQuery를 모바일 페이지에서는 pageshow처럼, 적절한 jQuery를 모바일 페이지 이벤트를 사용할 필요가로드 된 후 실행되는 뭔가를로드하려면

나는 JQuery와 모바일 1.3과 jQuery를 1.9.1

답변

3

을 사용하고 있습니다.

다음은 예입니다 :

$(document).on('pageshow', '#index', function(){  
    alert('Page loaded'); 
}); 

그리고 여기에 동작하는 예제입니다 : http://jsfiddle.net/Gajotres/tuJEm/

당신은 pageshow 이벤트 내부에 코드를 삽입해야합니다. #index은 페이지의 ID 여야합니다.

당신이 jQuery를 모바일 페이지 이벤트에 대한 자세한 내용을 찾으려면

ARTICLE 살펴보고, 또는 HERE을 찾을 수 있습니다.

1

bind은 권장되지 않습니다. 대신 on을 사용하십시오. jQuery를 1.7로서

http://api.jquery.com/bind/

는 CSTE 연구진() 메소드는 문서 이벤트 핸들러를 부착하기위한 바람직한 방법이다. 이전 버전의 경우 .bind() 메서드는 이벤트 핸들러를 요소에 직접 연결하는 데 사용됩니다. 핸들러는 jQuery 오브젝트의 현재 선택된 요소에 연결되므로 .bind() 호출이 발생하는 지점에 해당 요소가 있어야합니다. 보다 유연한 이벤트 바인딩에 대해서는 .on() 또는 .delegate()의 이벤트 위임에 대한 설명을 참조하십시오.

관련 문제