달 선택기가 작동하지 않습니다.

안녕하세요, 테이블 안에 달 선택기를 표시 할 수 없습니다.달 선택기가 작동하지 않습니다.

<!DOCTYPE html> 
<head> 
    <script src="js/libs/jquery-1.9.1.js"></script> 
     <link rel="stylesheet" href="css/jquery-ui.css" /> 
<script src="js/libs/jquery-ui-1.10.3.custom.min.js"></script> 
$(function() { 
    $('.date-picker').datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     showButtonPanel: true, 
     dateFormat: 'MM yy', 
     onClose: function(dateText, inst) { 
      var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
      var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
      $(this).datepicker('setDate', new Date(year, month, 1)); 
     } 
    }); 
}); 
</script> 
<script> 
     window.onload = function() { 
    PreLoadSection(); 
</script> 
<style> 
.ui-datepicker-calendar { 
    display: none; 
    } 
</style> 


</head> 
<body> 
<div id="variables" name="variables" style="width:100%; overflow:auto; overflow: scroll;">   
    </div> 
</body> 
</html>

위 내 HTM 코드 내의 .js 아래 코드 위

function PreLoadSection() 
{ 
LoadSectionStratified(); 
} 
function LoadSectionStratified() { 
    $('#variables').append($('<table id="variables_table">')); 
    $('#variables').append($('<tr>')); 
    $('#variables').append('<th style="border: 10px">month picker</th>'); 
     $('#variables').append($('</tr>')); 

    $('#variables').append($('<tr>')); 
    AddDate_MonthYear_StratifiedSection(); 
$('#variables').append($('</tr>')); 
    $('#variables').append($('</table>')); 
$('#variables').trigger('create'); 
} 

function AddDate_MonthYear_StratifiedSection() { 
table_html = '<td style="min-width: 200px;"><input name="name1" id="id1" value="" class="date-picker"></td>'; 
$('#variables').append(table_html); 
}

파일을 위치 : implemeting하고 방법이지만이 작업을 나던. 내가

출처

2013-10-16 JoseLuke

가 포함 된 라이브러리와 변수의 정의 ('control_i를 포함하여 * 전체 * 예보기 d' 등). [JavaScript 오류 콘솔] (http://www.netmagazine.com/tutorials/javascript-debugging-beginners)을보고 거기에 보이는 오류와 해당 오류가 가리키는 행을 알려줍니다. – JJJ

datepicker는 jQuery 함수가 아니며 jQueryUI에 포함되어 있습니다. jQuery 이후에 jQueryUI를로드하는 것을 잊지 않으셨습니까? 또한 jQuery UI를 javascript 및 jquery 뒤에 질문에 태그로 추가 할 수 있습니다. – Eirinn

@Juhana -i는 매우 큰 프로그램과 코드의 대부분이 모든 것을 얻기 위해 긴 사슬을 만드는 다른 것들을 참조하기 때문에 @Juhana -i가 코드를 편집하려고했습니다. – JoseLuke

내가 그것을 새로 추가 된 DOM 요소이기 때문에이 될 수있다 생각 LoadSectionStratified 함수를 호출 프리로드 함수를 호출 창로드에 파이어 폭스를 버전 24 를 사용하고, 다시 당신의 $('.date-picker') 등 :

$(document).on('focus', '.date-picker', function() { 
    $(this).datepicker({ 
     //Options 
    }); 
});

어떤 현재 존재하는 $('.date-picker')에 대한 전체 문서를 청취합니다.

바이올린 : 내가 예를 들어 당신의 코드와 데모를 추가 한 언급 http://jsfiddle.net/dHYfv/5/

Juhana으로는 DOM에 추가시를 초기화하는 청소기있을거야, 조정 :

var opts = { 
     changeMonth: true, 
     changeYear: true, 
     showButtonPanel: true, 
     dateFormat: 'MM yy', 
      onClose: function(dateText, inst) { 
       var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); 
       var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); 
       $(this).datepicker('setDate', new Date(year, month, 1)); 
      } 
     }; 

function AddDate_MonthYear_StratifiedSection() { 
    var table_html = '<td style="min-width: 200px;">'+ 
        '<input name="name1" id="id1" '+ 
          'value="" class="date-picker" />'+ 
        '</td>'; 

    $('#variables').append(table_html) 
        .find('.date-picker') 
        .datepicker(opts); 
}

바이올린 : http://jsfiddle.net/dHYfv/6/

출처

2013-10-16 08:25:49 MackieeE

이 접근 방식은 나에게 light.now를주는 이유는 무엇입니까? 1 달 동안 달 컨트롤을 클릭하면 아무 것도 할 수 없지만 컨트롤 밖을 클릭 한 다음 다시 작동하기 전 까진 까닭은 무엇입니까? – JoseLuke

나는 내 대답을 바꿨고,'click'을'focus'로 바꿨다. 왜냐하면 select 이벤트를 이미 완료 한 후에'datepicker'가 초기화 되었기 때문에, 포커스는 클릭이 완료되기 전에 초기화 될 수있게 해준다. – MackieeE

입력란을 만들 때 datepicker를 한 번만 초기화하면 더 깨끗합니다. – JJJ

달 선택기가 작동하지 않습니다.

답변

관련 문제