append() 후 선택된 옵션이 표시되지 않음

JSON 데이터를 기반으로 HTML 문자열을 작성하고 있습니다. HTML의 <select>은 <option>입니다. <option>의 값이 일부 JSON 데이터와 같으면 옵션 태그에도 selected="selected" 속성이 포함됩니다. 그 후, 전체 가디언은 디스플레이에 .append()입니다.append() 후 선택된 옵션이 표시되지 않음

모든 옵션이 선택되지 않았다는 점을 제외하면 훌륭하게 작동하는 것처럼 보입니다. Chrome의 웹 개발 도구에서 코드를 확인하면 selected="selected" 속성이 있음을 알 수 있습니다. :selected 옵션 중 console.log() 옵션을 선택하면 해당 옵션이 선택됩니다. 그러나 특정 <option>까지 드릴 다운하고 살펴보면 selected 특성이 false으로 설정된 것으로 표시됩니다.

뭐 ...?

나는 .select() 및 .attr("selected","selected") jQuery 메서드를 사용하여 문제를 강제로 시도했지만 아무런 차이가 없었습니다.

다른 사람이 무슨 일이 일어나는지 알아낼 수 있습니까? 그것은 단지 나의 무서운 무지일지도 모른다. 그러나 이것은 그것이 일해야하는 것처럼 나에게 보인다.

코드를 참조하십시오. dataArray은 개체의 배열입니다. $display는 jQuery를가 HTML이 .append() 보내고하는 것입니다 <table> 포장입니다 :

$orderNumberField = jQuery("#orderNumber"); 
_orderNumberArray = $.parseJSON($orderNumberField.val()); 

for(n in dataArray) { 
    var _displayString = ""; 

     // ... other table data cells ... 

    _displayString += "<td><select class='orderNumSelect'>"; 
    _displayString += " <option value=''></option>"; 
    for(i in _orderNumberArray){ 
     _displayString += "<option value='" + _orderNumberArray[i] + "'"; 
     if(dataArray[n].orderNum == _orderNumberArray[i]) _displayString += " selected='selected'"; 
     _displayString += ">" + _orderNumberArray[i] + "</option>"; 
    } 
    _displayString += "</select></td>"; 

     // ... still other table data cells ... 

    $display.append(_displayString); 
}

출처

2013-02-11 Felix T. Katt

당신이 말할 때 : "특정

DOM 브라우저에서. –

난 당신의 코드를 작동하지 모르겠어요,하지만 당신은 오히려 텍스트를 추가하는 것보다 요소를 생성 할 수 있습니다. 이 코드 함께 테스트는 위에 설명 된 코드는 내가 설명되어있는 문제에 대한 잘못이 아니었다 밝혀으로는

<script> 
    var dataArray=["test","testm2","Tasat3"]; 
     function append(){ 
      var td=document.createElement("td"); 
      var sel=document.createElement("select"); 
      var o=document.createElement("option"); 
      sel.appendChild(o); 
      for (n in dataArray){ 
       o=document.createElement("option"); 
       o.value=dataArray[n]; 
       o.text=dataArray[n]; 
       if (n==1) o.selected=true; 
       sel.appendChild(o); 
      } 
      td.appendChild(sel); 

      document.getElementById("display").appendChild(td); 
     } 
     append(); 
    </script>

출처

2013-02-11 16:59:41

문자열 대신 DOM 요소로 작업 할 필요가 없기를 바랐지만 그럴 경우 ... 결과를 보내고 회신 해 보겠습니다. –

잘 작동합니다. 양식 입력을 다시 설정하는 코드가 실행 중입니다. 다른 코드의 jQuery 선택기가 너무 일반적으로 작성되어서는 안되는 경우에도 생성 된 select 필드를 선택했습니다.

모든 의견 제출해 주셔서 감사합니다. 문자열을 생성하는 대신 DOM 요소를 사용하도록 코드를 다시 작성 했으니 조금 더 읽기 쉽습니다. 우연히 의도하지 않은 부작용이 있습니다.

출처

2013-02-12 15:53:37

append() 후 선택된 옵션이 표시되지 않음

답변

관련 문제