我必须点击两次让日期选择器显示

时间:2016-07-14 09:40:38

标签: javascript c# jquery asp.net datepicker

我创建了一个显示datepicker的jquery代码,它工作得很好但我需要单击文本框两次才能让datepicker熄灭。我使用$(document).ready(function ()进行了尝试,但我没有工作。所以我做了这个代码

$("[id*=txtDatePO]").live("click",function () {
        $(this).datepicker({
            //buttonImage: '../Images/Icons/calendar_1_icon&16.png',
            //buttonImageOnly: true,
            //showOn: 'both',
            dateFormat: 'yy-mm-dd',
            inline: true,
            firstDay: 1,
            showOtherMonths: true,
            dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']

        });
    });

    $("[id*=txtDelDate]").live("click", function () {
        $(this).datepicker({
            dateFormat: 'yy-mm-dd',
            inline: true,
            firstDay: 1,
            showOtherMonths: true,
            dayNamesMin: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
        });
    });

如何将其更改为用户单击文本框一次,只需单击一下即可显示日历。谢谢!

2 个答案:

答案 0 :(得分:0)

我从未使用过日期选择器如果我正确理解了click事件似乎是内置的:

这是我分叉和修改以在现有和动态(创建)元素上进行测试的示例: http://jsfiddle.net/julienetienne/shzwaL7v/1/

var dynamicElement = document.createElement('input');
var body = document.getElementsByTagName('result')[0];

dynamicElement.id = 'input3';
dynamicElement.type ='text';
document.body.insertBefore(dynamicElement,$('#input2').get(0));

$('#input1').datepicker({
   dateFormat: 'dd-mm-yy'
});

$('#input2').datepicker({
   dateFormat: 'dd-mm-yy'
});

$(dynamicElement).datepicker({
   dateFormat: 'dd-mm-yy'
});



<input id="input1" type="text" />
<input id="input2" type="text" />

没有理由使用document.ready()或.live()。只要代码在页面加载后执行就应该有效。

答案 1 :(得分:0)

应该在document ready

$(document).ready(function () {
     $('#txtDatePO').datepicker({
            todayHighlight: true,
            orientation: "bottom left",
            autoclose: true
     });
});

顺便说一下,这个样本引导程序datepicker