jquery datepicker无法点击按钮

时间:2013-10-25 03:52:43

标签: javascript jquery html css datepicker

我正在研究jquery datepicker。它正在点击一个按钮,但只在mozilla firefox中,但不在谷歌浏览器中也不在IE中。请告诉我该做什么,以便datepicker适用于所有浏览器。请发布jsfiddle

HTML

<input type="button" id="selectdate" value=""> 


<textarea name="dates" id="dates" maxlength="160" placeholder="your message" rows="4" cols="50"></textarea> 

JQUERY

$( "#selectdate" ).datepicker({ 
altField: $('#dates').val(), 
numberOfMonths:1, 
altFormat: "yy-mm-dd", 
minDate: -0, 
onSelect: function( selectedDate ) { 
$("#selectdate").val(''); 

$('#dates').val($('#dates').val()+','+selectedDate); 
} 
}); 

2 个答案:

答案 0 :(得分:1)

无法重新创建问题...但我认为您需要的是使用showOnbuttonImage选项而不是使用按钮来呈现日期选择器

<input type="text" id="selectdate" value="" style="display: none">

然后

$("#selectdate").datepicker({
    altField: $('#dates').val(),
    numberOfMonths: 1,
    altFormat: "yy-mm-dd",
    minDate: -0,
    buttonImage:'http://placehold.it/32',
    showOn: "both",
    onSelect: function (selectedDate) {
        $("#selectdate").val('');

        $('#dates').val($('#dates').val() + ',' + selectedDate);
    }
});

演示:Fiddle

答案 1 :(得分:1)

试试以下..

Demo Fiddle

JS:

$("#selectdate").datepicker({
    altField: $('#dates').val(),
    numberOfMonths: 1,
    altFormat: "yy-mm-dd",
    minDate: -0,
    buttonImage: 'http://placehold.it/32',
    showOn: "both",
    onSelect: function (selectedDate) {
        $("#selectdate").val('');

        var attr = $("#dates").attr("selectedDate");
        if (typeof (attr) !== 'undefined' && attr !== '') {
            if ($('#dates').val() !== '') {
                var tmpVal = $('#dates').val().substring(0,$('#dates').val().indexOf(attr));
               console.log(tmpVal); 
              $('#dates').val(tmpVal + selectedDate);
              $('#dates').attr("selectedDate", selectedDate);
            } else {
                $('#dates').val(selectedDate);
            }
        } else {
            $('#dates').attr("selectedDate", selectedDate);
            $('#dates').val($('#dates').val() + selectedDate);
        }
    }
});