Javascript JQuery append가 작동하지 않습니다.

동적으로 추가 된 일부 콘텐츠에 일부 콘텐츠를 동적으로 추가하려고합니다. 방금 추가 한 SELECT에 OPTION 개의 항목을 넣고 싶습니다. SELECT은 외부 .php 파일의 일부 코드와 함께 추가됩니다 (아래 참조). 이 부서는 괜찮아 보입니다. 그러나 SELECT 안에 추가하려고 시도한 내용은 나타나지 않습니다. 내 SELECT은 단순히 비어 있습니다. 나는 오류가 없다. 아래 코드의 콘솔 출력은 내가 기대 한 것을 체크 아웃하고 출력합니다. 여기 Javascript JQuery append가 작동하지 않습니다.

$.get("test-new-product-modal.php", function(data){ 
    $(".modal-body").html(data); 
}); 
$divSelect = $("#product-list"); 
for(var i = 0; i<(arrayProductTypes.length); i++){ 
    $divOption = $("option", {'value' : i}); 
    $divOption.html(arrayProductTypes[i][0]); 
    $divSelect.append($divOption); 
    console.log("Product ID at "+i+" is: "+arrayProductTypes[i][0]); 
}

난에서 HTML을 추가 .PHP 파일입니다 : 여기

는 자바 스크립트 코드 내가 믿는

<div class="container-fluid no-padding"> 
    <div class="col-sm-6 col-md-6 col-lg-6"> 
     <h4>Välj en produkt.</h4> 
     <select id="product-list" class="form-control"> 
      <!-- <option>DRA</option> 
      <option>DRB</option> --> 
     </select> 

     <div class="divider-line"></div> 

    </div> 
    <div class="col-sm-6 col-md-6 col-lg-6"> 
     <p class="product-add-description">Text.</p> 
    </div> 
</div>

출처

2016-06-21 Adrian Hansson

넌 할 수있어? 이 문제를 재현 한 피들 (fiddle) 또는 플래툰 (plunkr)을 먹었습니까? – CodeToad

'$'를 사용하여 변수를 선언하지 않습니다. 그것은 PHP 구문입니다. 대신에'var divSelect ='를 사용하십시오. –

'$ '를 사용하면 jquery 객체를 나타낼 수 있습니다. – guradio

는 jQuery를 당신이 문서를 찾을 수 있습니다

$.get("test-new-product-modal.php", function(data){ 
    $(".modal-body").html(data); 
}); 
$divSelect = $("#product-list"); 
for(var i = 0; i<(arrayProductTypes.length); i++){ 
    $divOption = $("option", {'value' : i}); 
    $divOption.html(arrayProductTypes[i][0]); 
    $divSelect.add($divOption); 
    console.log("Product ID at "+i+" is: "+arrayProductTypes[i][0]); 
}

() 메소드를 추가하십시오 here

출처

2016-06-21 13:54:42 rick

의 당신은 당신의 옵션 객체가이 시도 선언 방법 :

$divOption = $("<option>").attr('value',i);

출처

2016-06-21 13:52:20

options을 올바르게 추가하지 않았습니다. 당신이 JQuery와 object 같은 options을 추가 할 경우에 당신은 당신이를 반환하는

$('<option></option>').val(i).html("somehtml")를 사용할 필요가 있으므로이

for (var i = 0; i < (arrayProductTypes.length) ; i++) { 
    $divOption = $('<option></option>').val(i).html(arrayProductTypes[i][0]) 
    $divSelect.append($divOption); 
    console.log("Product ID at " + i + " is: " + arrayProductTypes[i][0]); 
}

이 줄 $divOption = $("option", {'value' : i});는 대신 빈 배열을 반환하는 option 객체를 반환하지 않습니다 할 수 option.

출처

2016-06-21 13:52:52 Mairaj

이것은 작동하지 않았다 :/나는 SELECT 요소를 찾는 것에 뭔가 잘못되었다고 생각한다. .remove를 호출해도 제거되지 않습니다. 하지만 다른 요소 (외부 파일에서 추가되지 않은 요소)에서 똑같은 방식으로 시도하면 작동합니다. –

나를 위해 작동합니다. – Mairaj

간단히 콘솔'$ ("# product-list");'에서 이것을 실행하여'select'를 찾았는지 확인하십시오 – Mairaj

작업 jsFiddle 무엇을 기대하고 비슷한의 :

그것은에 추가 할 많은 간단합니다 다음과 같은 HTML 요소 :

.append('<option value="' + array[i] + '">' + array[i] + '</option>');

출처

2016-06-21 13:55:42 wmash

Javascript JQuery append가 작동하지 않습니다.

답변

관련 문제