Internet Explorer 비 호환성 v9 및 v8 [개체 개체] ~ 추가

Question

대시 보드의 "축소 된"창에 요약 테이블을 표시하고 사용자가 입력 한 쿼리 매개 변수와 함께 요약 테이블을 보여주는 구성 요소 인 대시 보드 프로젝트를 개발 중입니다. 특정 보고서.

이 코드는 Chrome, Firefox, Internet Explorer 11 및 10, Microsoft Edge에서 완벽하게 렌더링되며 올바르게 렌더링 된 예입니다.

하지만, 내 고객의 일부는 여전히 인터넷 익스플로러 9와 8을 사용하고 난 호환 코드를 지원해야하며, 다음의 예와 같이 I 문제가이 버전입니다. 당신은 요약 테이블 위에 표시됩니다 몇 가지 이유 [개체 개체]에 대한 각 사용자의 입력 객체에 대해 볼 수 있습니다 그래서

.

사용자 입력 변수 숨겨진 태그로서 저장되고, 예

아래에 난에 저장된 입력 변수를 전달하여 테이블을 채우는)

1 프로세스는 다음과 결과를 포함하는 JSON 객체를 반환합니다.

$.getJSON('/analyticsdashboard/SysoutSearch/GetSysout?' + $('#hdnParameters').val().slice($('#hdnParameters').val().indexOf('?') + 1)).done(function (result) { 
      var tbl = $("#tbl"); 
      var tbody = $('#tbl>tbody'); 

2) 그런 다음 'strip' 특정 개체에

변수 아웃

var jobName = getURLParameterForHtml('jobName', $('#hdnParameters').val()); 
      var startDate = getURLParameterForHtml('startDate', $('#hdnParameters').val()); 
      var startTime = getURLParameterForHtml('startTime', $('#hdnParameters').val()); 
      var endDate = getURLParameterForHtml('endDate', $('#hdnParameters').val()); 
      var endTime = getURLParameterForHtml('endTime', $('#hdnParameters').val()); 
      var lastxDays = getURLParameterForHtml('lastxDays', $('#hdnParameters').val()); 
      var tableName = getURLParameterForHtml('tableName', $('#hdnParameters').val()); 
      var groupName = getURLParameterForHtml('groupName', $('#hdnParameters').val()); 
      var applicationName = getURLParameterForHtml('applicationName', $('#hdnParameters').val()); 
      var memberName = getURLParameterForHtml('memberName', $('#hdnParameters').val()); 
      var owner = getURLParameterForHtml('owner', $('#hdnParameters').val()); 
      var nodeId = getURLParameterForHtml('nodeId', $('#hdnParameters').val()); 
      var endStatus = getURLParameterForHtml('endStatus', $('#hdnParameters').val()); 
      var serverName = getURLParameterForHtml('serverName', $('#hdnParameters').val()); 
      var orderId = getURLParameterForHtml('orderId', $('#hdnParameters').val()); 

var getUrlParameter = function (sParam, url) { 
//debugger; 
//window.location.search 
var sPageURL = decodeURIComponent(url.substring(1)), 
    sURLVariables = sPageURL.split('&'), 
    sParameterName, 
    i; 

for (i = 0; i < sURLVariables.length; i++) { 
    sParameterName = sURLVariables[i].split('='); 

    if (sParameterName[0] === sParam) { 
     return sParameterName[1] === undefined ? true : sParameterName[1]; 
    } 
} 

} 아래 getUrlParameter 기능;

3) 그때 데이터를 포함, 즉 비어 있지 않은 및 요약 테이블 본체에 행으로 그들을 추가 개체에 대한 테스트

if (jobName[1]) { 
         var newRow = "<tr><td></td><td>" + "Job Name" + "</td>" + "<td>" + jobName[1] + "<td></td></tr>" + tbody.append(newRow); 
        } 

아래의 예를 들어 내가 SO에서이 여기에 연구를 시도했습니다, 예 : Internet Explorer Incompatibility - page just shows "[object Object]" WTH?

그러나 해결책을 찾지 못했거나 문제를 완전히 이해하지 못했습니다.

내가 알고 싶습니다

1) 왜이 문제 IE9과 IE8에서 발생하지 않습니다 크롬, 파이어 폭스, IE 10 (IE11), 마이크로 소프트 에지?

2)이를 해결하려면 어떻게해야합니까?

Answer 1

이 문제점은 새 행을 요약 테이블에 추가하기 위해 HTML을 코딩하지 않아서 발생했습니다.

은 이전 I 그것은 IE8 및 IE9의 문제점이 발생 하였다 미스 코딩

if (jobName[1]) { 
        var newRow = "<tr><td></td><td>" + "Job Name" + "</td><td>" + jobName[1] + "</td></tr>" + tbody.append(newRow); 
       } 

로서, 예를 들어, 각각의 새로운 로우를 부가.

내가 두 개의 문에 새 행과 tbody.append (newRow)을 분할하여 코드를 변경했습니다>, 예

if (jobName[1]) { 
       var newRow = "<tr>" + "<td></td>" + "<td>" + "Job Name" + "</td><td>" + jobName[1] + "</td>" + "</tr>"; 
       tbody.append(newRow); 
      } 

을 다음과 내 "축소 된"창이 이제 IE8에서 제대로 렌더링 IE11, Microsoft Edge, Chrome 및 Firefox.