Question

我正在制作一个jquery表单。我需要在我点击的那些输入字段上显示div。（比如工具提示......但不完全正确）...你...你可以把它叫做datepicker ......

谢谢---- 的更新
使用Javascript：

 <script>
        $(document).ready(function() {

            $('#months :input').click(function(){
                xpos = $(this).css('left');
                ypos = $(this).css('top');
                var dateField = $(this);

                $('#calender').addClass('calender_visible');
                var m = $('#calender .picker_month :selected').val();
                var y = $('#calender .picker_year :selected').val();


                $('#calender :button').click(function(){
                    dateField.val(m+'/'+y);
                    $('#calender').removeClass('calender_visible');

                })

            })

        });

        </script>

CSS：

<style>
    .calender_hidden{
        display:none;
    }

.calender_visible{
    display:block;
    position:relative;
background-color:#CCCCCC;
width:120px;

    height:50px;
  }
</style>

HTML：

    <input name="month2"  />

    <input name="month3"  />

    <input name="month4"  />

    <input name="month5"  />
    </div>




    <div id="calender" class="calender_hidden" > 

    <select  class="picker_month">
        <option value="Jan">Jan</option>
        <option value="Feb">Feb</option>
        <option value="Mar">Mar</option>
        <option value="Apr">Apr</option>
    </select>

    <select  class="picker_year">
        <option value="2001">2001</option>
        <option value="2002">2002</option>
        <option value="2003">2003</option>
        <option value="2004">2004</option>
    </select>
    <input type="button" value="close" />
    </div>

现在的问题是......我想只在我选择的div上显示这个小日历......但是这并没有出现在我点击的对象下...我每次点击输入字段时都会重新定位

Answer 1

如果你想要一个日期选择器，你可以使用jquery UI中的那个

http://jqueryui.com/demos/datepicker/

Answer 2

不确定您是否尝试捕获诸如按钮之类的输入的单击，或者是为文本输入等输入而聚焦。无论哪种方式在jQuery中捕获事件都很简单：

//capture click event
$('input#id').click(function() {
       $('div#id').show();
}
//capture focus event (such as clicking in a text input field)
$('input#id').focus(function() {
       $('div#id').show();
}

希望这有帮助

Answer 3

你应该看看jQuery UI有一个对话框（），它可能就像你要去的工具提示一样接近

如何在jquery中的输入字段上显示div

3 个答案: