Binding jQuery日期选择器在AJAX之后不持久

所以我使用jQuery日期选择器，它工作得很好。我正在使用AJAX去获取一些内容，显然，当应用这个新内容时，绑定丢失了，我发现了

.live（）

方法

但我如何将其应用到我的约会选择者身上呢？因为这不是一个事件，所以

.live（）

将无法帮助。。。对吧?

这是我用来将日期选择器绑定到输入的代码：

$(".datefield").datepicker({showAnim:'fadeIn',dateFormat:'dd/mm/yy',changeMonth:true,changeYear:true});

我不想每次启动AJAX时都调用这种方法，因为我希望尽可能保持通用性

干杯：-）

编辑

按照@nick的要求，下面是我的包装函数获得的

ajax（）

方法：

var ajax_count = 0;
function getElementContents(options) {
    if(options.type===null) {
         options.type="GET";
    }

    if(options.data===null) {
        options.data={};
    }

    if(options.url===null) {
        options.url='/';
    }

    if(options.cache===null) {
        options.cace=false;
    }

    if(options.highlight===null || options.highlight===true) {
        options.highlight=true;
    } else {
        options.highlight=false;
    }

    $.ajax({
        type: options.type,
        url: options.url,
        data: options.data,
        beforeSend: function() {
            /* if this is the first ajax call, block the screen */
            if(++ajax_count==1) {
                $.blockUI({message:'Loading data, please wait'});
            } 
        },
        success: function(responseText) {
            /* we want to perform different methods of assignment depending on the element type */

            if($(options.target).is("input")) {
                $(options.target).val(responseText);
            } else {
                $(options.target).html(responseText);
            }
            /* fire change, fire highlight effect... only id highlight==true */
            if(options.highlight===true) {
                $(options.target).trigger("change").effect("highlight",{},2000);
            }
        },
        complete: function () {
            /* if all ajax requests have completed, unblock screen */
            if(--ajax_count===0) {
                $.unblockUI();
            }
        },
        cache: options.cache,
        dataType: "html"
    });
}

那么这个解决方案呢，我有一个rules.js，它包含了我与元素的所有初始绑定，如果我将这些元素放在一个函数中，然后在ajax方法的成功回调中调用该函数，这样我就不会重复代码了

---

嗯，请想一想：如果你还没有：

“我让它在lightbox第一次出现时绑定到lightbox的输入，但之后它就不工作了。”

---

“当lightbox关闭时，我会将其内容追加到页面中（为了不丢失content div），这似乎会终止live（）调用。”

日期选择器是文本输入控件上的一个单击函数。因此，您可以轻松地：

$('#datepicker').live('click', function(){$(this).datepicker($.datepicker.regional['en']);})

---

您可以这样做：

function createPickers(context) {
  $(".datefield", context || document).datepicker({
    showAnim:'fadeIn',
    dateFormat:'dd/mm/yy',
    changeMonth:true,
    changeYear:true
  });
}

$(createPickers);

createPickers(responseText);

要在

document.ready

上运行，如果您已经有

document.ready

函数，可以调用：

createPickers();

或者您可以在中运行它，如下所示：

function createPickers(context) {
  $(".datefield", context || document).datepicker({
    showAnim:'fadeIn',
    dateFormat:'dd/mm/yy',
    changeMonth:true,
    changeYear:true
  });
}

$(createPickers);

createPickers(responseText);

在

success

回调中，您可以这样称呼它：

function createPickers(context) {
  $(".datefield", context || document).datepicker({
    showAnim:'fadeIn',
    dateFormat:'dd/mm/yy',
    changeMonth:true,
    changeYear:true
  });
}

$(createPickers);

createPickers(responseText);

---

这样做只是在提供的上下文中选择

.datefield

（内部使用），依此类推

document.ready

您选择所有匹配的元素来创建日期选择器，但在ajax请求中，您只选择刚到达响应中的匹配元素，不在任何地方创建重复的日期选择器。

这将在每次单击元素时创建一个日期选择器小部件，这将是非常浪费的。+1 Nick，我想避免这种可能的方法。谢谢你，XGreen。你的ajax怎么样，

$。ajax

？您不重复代码的选项可以是通过上下文调用的函数，也可以是

.liveQuery（）

，如果您对此感兴趣，我可以向您演示如何执行此操作，只需注释@nick并让我知道。嘿@nick，我编辑了我的原始帖子，请参阅下面可能的解决方案…：-）谢谢汉克斯：）在下面贴了一个关于如何进行的答案。我不明白这与我有什么关系，因为它没有提供线索或答案？好的，这看起来是最好的解决方案。Nick您是否建议将我的所有绑定规则（如单击、更改等）包含在一个函数中，然后我可以在成功回调中调用这些规则？那我就不用使用

.live（）

了吧？只是想知道

.live（）

的局限性。谢谢：-）@ILMV-如果您不使用那些其他事件创建小部件，我会使用

.live（）

，更干净、更简单、更少的事件处理程序。对于创建诸如

日期选择器

之类的小部件的东西，是的，我会将它们添加到一个函数中，该函数采用这样的上下文。非常感谢您的帮助，Nick！