$ (문서) .ready 및 $ ('# id'). 변경 결과가 다릅니다.

Site here.

$('#club').change(function(event)의 코드는 작동하지만 $(document).ready(function()의 코드는 작동하지 않는 이유는 무엇입니까? $.ajax 기능은 동일하지만 전자는 기능을 수행하지 않습니다.

<script type="text/javascript"> 

    $(document).ready(function() { 
     $.ajax({ 
      type: "post", 
      url: "eventinfo.php", 
      data: $(this).serialize(), 
      success: function(data) { 
       $('#right_inside').html('<h2>' + $('#club').val() + '<span style="font-size: 14px"> (' + data[0].day + ')</h2><p>Entry: ' + data[0].entry + '</p><p>Queue jump: ' + data[0].queuejump + '</p><p>Guestlist closes at ' + data[0].closing + '</p>'); 
       }, 
      dataType: "json" 
     }); 
    }); 

    $('#club').change(function(event) { 
     $.ajax({ 
      type: "post", 
      url: "eventinfo.php", 
      data: $(this).serialize(), 
      success: function(data) { 
       $('#right_inside').html('<h2>' + $('#club').val() + '<span style="font-size: 14px"> (' + data[0].day + ')</h2><p>Entry: ' + data[0].entry + '</p><p>Queue jump: ' + data[0].queuejump + '</p><p>Guestlist closes at ' + data[0].closing + '</p>'); 
       }, 
      dataType: "json" 
     }); 

    }); 

</script>

출처

2012-06-14 Sebastian Salek

HTML을 표시하십시오. 또한 그것이 어떻게 작동하지 않는지 설명하십시오. 에러 메시지? –

나는이 페이지를 보았는데, 사용자가'디스코 @Lola Lo를 죽이자. '라고 선택하면 아무 일도 일어나지 않습니다. 그래서 jquery에 문제가 없다는 생각이 들지만, 그것은'# club' 선택 상자에있는 항목에 문제가 있습니다. –

요소의 "id"값에 공백이 없어야합니다. – Pointy

요청이 이루어진다. 즉, 크롬 개발자 도구에서 네트워크 탭을 선택하여 확인하기 쉽다. 그것은 빈 반환 배열은 data = []입니다. 따라서 data[0].day은 오류를 발생시키고 그 오류는 정상적으로 처리되지 않습니다. ht.

두 코드 블록의 차이점은 변수 this에 포함 된 내용입니다. 첫 번째 것은 document을 포함하는 jQuery 객체입니다. 두 번째 것은 id가 club 인 <select> 요소를 포함하는 jquery 객체입니다. $(document).ready에서 동일한 요소를 serialize하려는 경우 $(this)을 $(#club)으로 변경하면됩니다.

출처

2012-06-14 00:38:19 Paulpro

방금 시도했지만 작동하지 않습니다. 문제를 일으킬 수있는 다른 격차가 있습니까? –

@SebastianSalek 그럼 오류를 수정 했으므로 문서에 서버에 데이터를 올릴 준비가되었습니다. 그러나'Let 's Kill Disco @ Lola Lo'가 인식되지 않는 또 다른 오류 (서버 측)가 있습니다. 드롭 다운의 다른 항목은 모두 있습니다. – Paulpro

@SebastianSalek 드롭 다운의 다른 모든 항목의 경우 내용이있는 단일 객체가 포함 된 JSON 배열이 반환됩니다. 첫 번째 항목의 경우 빈 배열이 반환되고 오류가 발생합니다. 첫 번째 항목에서 다른 항목으로 전환하면 페이지의 내용도 변경되지 않습니다. Javascript 오류 때문입니다. – Paulpro

당신이 $(this) 변화 "를에? 준비 '핸들러의"에서 참조하는 기대를 무엇 #club "요소입니다.에서" "핸들러, 그입니다"준비 "핸들러, 그것은 뭔가 될 것입니다 대신 $(this).serialize()의 아마 쓸모.

나는 당신이 "준비"핸들러에서 $('#club').serialize() 싶은 생각합니다.

출처

2012-06-14 00:37:11 Pointy

문제는 HTML 코드에 있습니다.

<select id="club" class="dropdown" name="club"> 
    <option id="Let" lo'="" lola="" @="" disco="" kill="" s="">Let's Kill Disco @ Lola Lo</option> 
    <option id="Fuzzy Logic @ The Place">Fuzzy Logic @ The Place</option> 
    <option id="BOOM! @ The Place">BOOM! @ The Place</option> 
    <option id="Fuzzy Logic @ Ballare">Fuzzy Logic @ Ballare</option> 
    <option id="Jelly Baby @ Ballare">Jelly Baby @ Ballare</option> 
    <option id="Fiesta @ Fez">Fiesta @ Fez</option> 
</select>

첫 번째 항목을 확인하십시오. ID가 없기 때문에 작동하지 않으며 태그가 엉망입니다. 이벤트를 목록에 추가 할 때 따옴표를 이스케이프 처리해야합니다. 그렇게하면 jQuery $.ajax 요청이 잘 작동합니다.

출처

2012-06-14 00:54:45

jquery Serialize가'id'를 사용하지 않기 때문에 문제가 해결되었지만 문제를 해결하지는 못합니다. – Paulpro

사실, 일단 serialize 및 deserialize되면,'eventinfo.php'가 적절한 결과를 리턴 할 수없는 경우, 아무것도 리턴하지 않습니다. 그러나 모든 것이 직렬화되는 것을 보아도 확실히 고칠 가치가 있습니다. –

$ (문서) .ready 및 $ ('# id'). 변경 결과가 다릅니다.

답변

관련 문제