PJAX 및 선택한 플러그 인
4399 단어 jquery-pjax
묘사
나는 chosen plugin에 문제가 있다는 것을 발견했다.이 플러그인은 전체 페이지를 불러올 때와 pjax를 불러올 때 잘 작동하지만 오류가 발생할 때 (무서워!)브라우저 뒤로 버튼을 사용합니다.나는 이것fork을 시도했는데, 이것은lightbox 플러그인의 문제를 복구했다.
또 보신 분 계세요?해결 방법/솔루션이 있습니까?당신의 도움에 감사 드립니다!
토론 #1
이 문제를 복제한 JSFIDLE을 발표할 수 있습니까?Choice는 pjax와 함께 사용할 것이며 지금까지 문제가 없습니다.토론 #2
pjax의 흔한 문제는 보통:1. 초기 페이지의 DOM을 로드할 때 플러그인을 호출합니다.이 예에서는 다음과 같습니다.
$(".chosen-select").chosen()
2. 플러그인이 DOM을 다시 쓰고 이벤트 처리 프로그램을 설정합니다.3. 누군가가 링크를 클릭한다.페이지 변환은 pjax에서 처리합니다.이전 DOM 상태는 메모리에 캐시되어 있습니다.
4. 누군가가 후퇴 버튼을 썼다.플러그 인이 수행할 수 있는 작업의 결과를 포함하여 이전 DOM 상태를 복원하지만 이벤트 처리 프로그램은 복원되지 않습니다.따라서 선택한 증강 선택 상자처럼 보일 수도 있지만, 어떤 경우에는 상호작용이 아닙니다.
이것은 모두 추측에 기초한 것이다.가능하다면, 예시 코드를 제공해 주십시오.나는 JSFIDLE를 사용하면 이 점을 하기 어렵다는 것을 이해한다. 왜냐하면 pjax를 테스트하는 유일한 방법은 페이지 전환을 하는 것이기 때문이다.감사합니다, 두 분.네, @mislav. 이런 행동도 당신이 묘사한 것 때문일 것 같습니다.
나는 일부 플러그인들이 pjax와 백 단추를 사용할 때 더 잘 나타난다는 것을 알아차렸다.나는 이것이 그들이 사용하기 때문이라고 생각한다.()에서?나는 같은 문제를 보았다. (이벤트 처리 프로그램?)그리고magnific popup.
만약 내가 테스트 사이트의 링크를 발표한다면 도움이 될까요? 아니면 더 많은 코드 상호작용이 필요합니까?JSFIDLE, jsbin을 어떻게 사용하는지 모르겠습니다...데모를 만듭니다.
감사합니다!
PS@staabm은 pjax가 요청한 후에 "후퇴"단추를 사용합니다. 선택한 것이 여전히 당신에게 적용됩니까?
토론 #셋
업데이트: Selected는 Selected v1로 업그레이드된 후 현재 pjax와 충분히 합작할 수 있습니다.4.2. 나는 이것이 다른 사람을 도울 수 있기를 바란다.토론 #4
알려주셔서 감사합니다!토론 #5
@craigphiz 해커 몇 명?후퇴나 전진 버튼을 눌렀을 때, 그것은 나에게 작용하지 않았다.토론 #6
@volnei, 네, 잘 작동하고 있습니다.습관이 있어요.페이지가 가득 차든지 (가득 차든지) 불러올 때마다 pjax나 후퇴/전진 단추 ("popstate") 를 사용하여 초기화할 js 파일을 선택하십시오.$(document).on('ready pjax:popstate pjax:end', function() {
if ($('#chzn').length > 0){
$('#chzn').remove();
}
$('#chzn').chosen({
search_contains: true,
disable_search_threshold: 10,
});
});
너는 이런 물건을 포함했니?행운을 빕니다!토론 #7
감사합니다@craigphiz:미소:토론 #8
안녕@volnei,천만에요:)만약 네가 여기서 내가 너에게 준 건의가 너에게 유용한지 확인한다면 아마도 다른 사람에게 도움이 될 것이다.
토론 #9
나는 select2와 icheck 플러그인에도 같은 문제가 있다.이 문제에 대해 무슨 뉴스가 있습니까?Selected 이외에 이 문제를 해결할 수 있는 다른 플러그인이 있습니까?나는 이 문제가 바로 @mislav에서 묘사한 것이라고 생각한다.select2와 icheck은 DOM을 수정하고 이벤트 처리 프로그램을 추가합니다.뒤로/전진 버튼을 사용하여 페이지를 로드하면 브라우저에 이벤트 처리기 대신 수정된 DOM이 표시됩니다.플러그인을 다시 초기화하려고 하면 (
토론 #10
DOM을 다시 수정하는 중 오류가 발생합니다.솔루션/제안/해결 방법이 있습니까?pjax:end
@azanelli, select2에 대한 해결 방법이 있습니다.$(document).on('pjax:end', function (event) {
$(event.target).find('.select').removeClass('select2-hidden-accessible');
$(event.target).find('.select2').remove();
$('#p0 .select').select2();
});
초기화 후 두 작업을 수행하려면 2 를 선택합니다.토론 #11
css 클래스를 jquery 선택기에 추가합니다. 다음은select2-hidden-accessible
select 태그 옆에
$(.select')
css 클래스가 있는span 태그를 생성합니다select2
대상 요소에서 Select2 작은 위젯을 수동으로 삭제하고 초기화해야 합니다. The select2('destroy') method was called on an element that is not using Select2.
또 다른 해결 방안은 두 요청 사이에 일회용 이벤트 감청기를 만드는 것입니다.나는 플러그인의 상태를 어떻게 더 잘 제어하는지 보여주는 요점을 만들었다.이것은 기본적으로 pjax가 플러그인을 시작할 때 발생하는 모든 것이다https://gist.github.com/RichardTMiles/851ed048b7939e7c01942a12ebe27445
Reference
이 문제에 관하여(PJAX 및 선택한 플러그 인), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://github.com/defunkt/jquery-pjax/issues/526텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)