jQuery 日期选择器在与其他表单元素重叠时不起作用

Question

我将 jQuery UI 日期选择器与 jQuery mobile 一起使用。当显示 jQuery 日期选择器并与其他表单元素重叠时，它不会选择所选日期。相反，它选择背景表单元素。有什么办法可以解决这个问题吗？

<table width="100%"><tr><td><label for="txtAnkomstLS">Date 1:</label>  </td><td><label for="txtAvresaLS">Date 2:</label>   </td></tr><tr><td>

<input type="text" id="txtAnkomstLS" data-mini="true" /></td><td>             
<input type="text" id="txtAvresaLS" data-mini="true" /></td></tr></table>



<label for="select-choice-3" class="select">Field 1:</label>
            <table width="100%">                
            <tr><td width="50%">        <select name="select-choice-1" id="select-choice-1" data-mini="true"  data-theme="c">
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>

            </select></td><td width="50%">      <select name="select-choice-2" id="select-choice-2" data-mini="true"  data-theme="c">
                <option value="0">0</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>

            </select></td></tr></table>


<label for="select-choice-3" class="select">Field 2:</label>
            <table width="100%">                
            <tr><td width="50%">        <select name="select-choice-3" id="select-choice-3" data-mini="true"  data-theme="c">
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>

            </select></td><td width="50%">      <select name="select-choice-4" id="select-choice-4" data-mini="true"  data-theme="c">
                <option value="0">0</option>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>

            </select></td></tr></table>


         <label for="search">Textinput:</label>
         <input type="text" id="search" value=""  data-mini="true" />       

$(function() {

    $( "#txtAnkomstLS" ).datepicker({ 
   });

    $( "#txtAvresaLS" ).datepicker({ 

    });

});

http://jsfiddle.net/wQRDx/4/

Answer 1

一个肮脏的解决方案是使用覆盖

$.datepicker.setDefaults({
    beforeShow: function ( input, inst ) {
        setTimeout(function(){
            inst.dpDiv.css({
                zIndex: 10000
            });
        })
    }
});

演示:Fiddle