jquery UI datepicker无法动态插入输入

时间:2012-07-14 19:15:52

标签: jquery jquery-ui datepicker dynamically-generated

我正在动态地将输入字段添加到td元素

$('.edit_text').live('click',function(){
    $(this).html('<input type="text" value="'+$(this).text()+'" style="background:url(text_bx.gif) no-repeat bottom;display:inline;padding: 0; margin: 0;" class="editing" >');
    $(this).children('input').focus();
    if ($(this).attr('id')=='date'){
        $(this).children('input').datepicker( "refresh");//"option", "dateFormat","yy-mm-dd");
    }
});

但是如果td有id日期,则datepicker没有出现。 我在插入的输入字段上也有模糊功能,这是一个问题吗?

$('.editing').live('blur',function(){
//did something
    });

1 个答案:

答案 0 :(得分:0)

嗯,以下是带有可编辑文本框的动态jquery date picker,您可以相应地更新代码。

&#13;
&#13;
$(function(){
    
    $('#thedate').datepicker({
        dateFormat: 'dd-mm-yy',
         onSelect: function(dateText) {
   		$('#dateContainer').text(dateText);
        console.log(dateText);
        }
        
    });
    
});
&#13;
<link href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script>
Shown Date : <div id="dateContainer" type="button" > currentData </div>
<input id="thedate" type="text" /><br />
<input id="thesubmit" type="button" value="Submit" />
&#13;
&#13;
&#13;

JS摆弄日期选择器: - http://jsfiddle.net/vikash2402/8w8v9/1989/

JS摆弄日期选择器和div: - http://jsfiddle.net/vikash2402/8w8v9/1990/

希望这会对您有所帮助:)