MSIE : jQuery 's Append ()/html ()가 작동하지 않음, getElementByid ()에 의지

StackOverflow https://stackoverflow.com/questions/1145672

문제

이것은 긴 것입니다.

전제

현재 프로젝트의 현재 프로젝트에 대한 버그 수정을 통해 고객에게 도움을 요청했습니다. 고정이 필요한 것은 작업 목록 페이지였습니다. 작업 목록이 있고, 하나를 클릭하고 JavaScript가 활성화되면 AJAX 호출이 기존 요소 (div#emploi_details)에 작업의 세부 사항을 동적으로로드하도록 만들어집니다. JS가 활성화되지 않으면 작업의 세부 사항을 사용하여 페이지를 다시로드합니다 (덜 중요합니다).

DEV 웹 사이트에서 작업하기 위해 실험실 서버로 뛰어 들었습니다.

문제

기본적으로 IE7 (처음에)은 $ (). load ()를 통해로드 된 컨텐츠를 표시하지 않았습니다. IE6는 InnerHTML과의 히치없이 일했습니다. 요청이 전송되고 매번 답장을받습니다. 데이터를 받고 알림 ()를 볼 수 있고 볼 수 있지만 컨텐츠의 실제 덤핑은 작동하지 않습니다. 사파리, 파이어 폭스, 문제 없음. div#emploi_details 요소에 정보를로드하는 요소에는 CSS 디스플레이가 있습니다. 없음; 스타일 리드에서 컨텐츠가로드 된 후에 표시됩니다 (다른 중요한 세부 사항).

show_emploi = function(id, succ_id)
{
    $('#emploi_details').fadeOut(800, function() {
        var $$ = $(this);

        $$.load('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
            if (isIE6) document.getElementById('emploi_details').innerHTML = data;
            $$.show();
        });
        $('#bgContent').fadeOut();
    });
}

해결책

처음에 나는 $ (). load ()가 방금 행동하고 있었을 것입니다. 그래서로드 된 컨텐츠의 조작에 대한 더 많은 제어를 위해 $ .get ()로 변경했습니다.

$.get('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
    $$.empty().append(data).show();
});

이것은 작동합니다. IE6 및 IE7을 포함한 모든 브라우저에서. 문제 없어요. 이상하지만, 그것이 효과가 있고 완전성이 있는지 알고 있습니다. 질문하지 마십시오.

플롯 트위스트

이제 똥이 이상해지는 곳이 있습니다. 버그가 고정되어 솔루션을 라이브 웹 사이트에 적용했는데 작동하지 않습니다. 즉, 그것을 좋아하지 않습니다. $ .ajax와 다른 모든 종류의 물건을 시도한 후 당황했습니다. 라이브 웹 사이트에 이것을 사용하게됩니다.

$.get('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
    document.getElementById('emploi_details').innerHTML = data;
    $$.show();
});

그리고 그것은 모든 브라우저에서 작동합니다. 왜냐하면 베어 본 JS와 같은 일을 끝내는 것은 없기 때문입니다. 반드시이 수정 사항은 DEV 웹 사이트에서도 작동합니다.

'계속해서'

모든 브라우저 (및 명확한 서버)에 대해 클릭하지 않는 컨텐츠의 임베딩 기능에는 무언가가 있습니다.

대체로 내 질문은 WTF 질문입니다. 한쪽에서 작동하는 이유를 이해할 수없고 다른 쪽에서 동일하게 작동하지 않거나 왜 처음에는 제대로 작동하지 않는지 ($ (). load ()). 프레임 워크 버전을 확인하는 것이 첫 번째 본능이기 때문에 분명히 다른 jQuery 버전 (1.2.6)이 아닙니다.

어쨌든, 흥미로운 미스터리 IMO.

Stackland에있는 누군가가 신이 부여한 대답이 있기를 바랍니다.

감사

도움이 되었습니까?

해결책

나는 수수께끼를 해결했다! 다음은 내 문제의 예제입니다. 트릭은 첫 번째 성공 후 다른 Ajax를 호출하는 것이 었습니다. 이것은 어떻게 든 InnerHTML의 문제를 무시할 것입니다. 나를 올바른 방향으로 설정해 주셔서 감사합니다.

지금까지는 아직 작업 솔루션을 보지 못했기 때문에 이것이 일부 사람들에게 도움이되기를 바랍니다. 나는 또한 jQuery에 연락 할 것입니다 : p

$.ajax({
url:'modifyarticle.php',
type:'POST',
data:{
 id:this.id,
 article:'something',
 mode:'single',
 action:'delete'},
cache:false,
success:function(msg) {
 alert(msg);$.ajax({
  url:'getall.php',
  type:'GET',
  cache: false, 
  success: function(data) {
   $('#output').html(data);
  }
 });
}});

Salut

다른 팁

나는 당신이 거기에 있어야한다고 생각합니다. 다음은 가능한 몇 가지 실패점입니다.

  • jQuery.clean : DOM에 추가되는 조각을 만드는 함수.

    DocType가 나쁘거나 응답 HTML이 어떤 방식 으로든 결함이있는 경우 깨끗한 기능이 실패하여 DOM에 삽입 할 수없는 경우 가능할 수 있습니다.

  • jQuery.fn.append : DOM에 렌더링 된 응답 조각을 추가합니다.

    jQuery가 InnerHTML이 아닌 AppendChild로 DOM에 컨텐츠를 추가하기 때문에 버그는 IE가 DOM이 변경되었음을 알지 못하고 신호가 변경되지는 않습니다. 그런 다음 InnerHTML을 사용하면 우회됩니다.

    주입 된 HTML이 실제로 존재하는지 확인한 경우 질문에서 명확하지 않습니다. 이것은 다음과 같은 것으로 테스트 할 수 있습니다.

    $$.empty().append(data);
alert( $$.parent()[0].innerHTML );
$$.show();

  • jQuery.fn.show () : 결과 표시.

    컨텐츠가 DOM에 넣지 않거나 표시되지 않기 때문에 궁극적 인 실패인지 여부는 귀하의 질문에서 명확하지 않습니까? 컨테이너에 패딩과 배경이 있다면 볼 수 있습니까?

    쇼 기능은 단순히 추가하는 것보다 더 복잡합니다 .style.display='block' 요소에. 숨겨져 있다고 생각하면 요소가 표시되지 않으며, 즉, 때로는 이상한 아이디어가있을 수 있습니다. Show ()을 수동으로 설정하여 표시로 교체하면 어떤 변경이 변경됩니까?

IE가 Stage/Dev 페이지와 라이브 사이트를 처리하는 방법에는 차이가 있음이 분명합니다. 나의 첫 단계는 그들 사이의 차이를 발견하는 것입니다. HTTP 제목, 인코딩, 도문, 추가 스크립트, 추가 CSS, 심지어 공백 ... 일부 사소한 차이는이 버그의 원인입니다.

여관이든,이 버그를 복제하는 데 필요한 필수품 만 감소 된 테스트 사례를 준비해야합니다. 편안한 치료법을 찾지 못하더라도 테스트 케이스는 함께 보내야합니다. jQuery에 대한 버그 보고서.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top