jquery userinterface在页面刷新时加载

Question

当用户从选择框中选择某个选项时，我会将日期选择器附加到div。 datepickers包括日历图像，我正在使用该图像的网址。当我选择一个选项时，div正确加载但未加载日历图像。但是当数据发布到另一个页面并且我回到这个页面时，图像被加载并且日历可以工作。

function add() {
   var option = $('#id').val();
    if(option !== 'valid'){
     $('#id').append('i have appended here the div that contains two datepickers');
}
}

datepicker的jquery代码如下：

$('#datepicker1').datepicker({
  //optional settings, but i have given the url for the calendar image which doesn't loads (i think) 
  //when the div is being appended, but when the page refreshes it displays the images and datepicker workds
})

Answer 1

这是因为$('#datepicker1').datepicker({})只会在调用时针对存在的元素。

由于加载的内容在调用datepicker()时不，因此未定位。

在加载后，您需要再次为加载的内容调用它，或者将事件处理程序绑定到加载（后者只是自动执行前者）。

Javascript / jQuery代码

function add() {
    var option = $('#id').val();
    if (option !== 'valid') {
        $('#id').append('i have appended here the div that contains two datepickers');
        $('.datepickers').datepicker({/*...*/});
    }
}

可能的解决方法是最初包含日期选择器，并将它们设置为display: none，直到满足指定的先验数据。

function add() {
    var option = $('#id').val();
    if (option !== 'valid') {
        $('#id .extra-content').show();
    }
}