jquery - 事件发生但脚本不会执行，直到事件发生两次

Question

当下拉列表具有特定的选定值时，我希望将日历设置为输入字段。我面临的问题是事件发生但脚本不会执行，直到点击发生多次，我尝试 click 和 focus 但结果相同!

这是我的代码

 <select name="selectKey" id="selectKey">
   <option value="1" >mail no</option>
   <option value="2" > mail type</option>
   <option value="3"  selected="selected"> mail date</option>
   <option value="4" >title</option>
</select>

<input type="text" name="srchTxt" id="srchTxt" value="">

​这是 js

$(document).ready(function() {



 $('input[name=srchTxt]').bind('focus', function(event) {
    // event.stopPropagation();

    if ($("select[name='selectKey']").children(':selected').val() == 3) {  
        console.log('ysssssssssssssss');
        $('input[name=srchTxt]').datepicker({
            //   showWeek: true,
            firstDay: 1,
            dateFormat: 'dd/mm/yy'
        })
    }
   });
});​

这是一个演示 http://jsfiddle.net/VAvwG/

Answer 1

只需将 .datepicker('show') 添加到末尾

$(document).ready(function() {
    $('input[name=srchTxt]').bind('focus', function(event) {
        if ($("select[name='selectKey']").val() == 3) {  
            $('input[name=srchTxt]').datepicker({
                firstDay: 1,
                dateFormat: 'dd/mm/yy'
            }).datepicker('show')
        }
    });
});

http://jsfiddle.net/VAvwG/3/