JQuery 时间选择器第二次不工作

JQuery time picker not working at second time

本文关键字：工作 第二次 选择器 时间 JQuery      更新时间：2023-09-26

我有一个模态对话框，其中包含通过ajax加载的表单。表单中是一个 tim 字段，使用 jquery 时间选择器填充。如果我打开一次对话框，一切正常。如果我第二次加载对话框而不刷新页面，则时间选择器不起作用

这是我的代码

<asp:TextBox runat="server" ReadOnly="true" CssClass="form-control timepicker" ClientIDMode="Static" ID="txtTime" />
     $(document).ready(function () {
        $("#txtTime").timepicker({
             twentyFour: false, title:'Time', showSeconds: false
        });
    });

由于您的问题本身可能相当不清楚，我将尝试提供两种可能解决您的问题的方案。

如果要替换 DOM 中的元素...

如果你的现有元素被替换或删除并重新添加到 DOM 中，你需要确保重新连接你的时间选择器函数，以针对 DOM 中该元素的最新实例

// Open your dialog here and re-write your elements
// This will target the new element that should now be present in the DOM 
$("#txtTime").timepicker({ twentyFour: false, title:'Time', showSeconds: false });

如果不知道如何显示或释放对话框及其内容的确切详细信息，则可能很难确定处理此问题的最佳方法，但每次显式实例化选取器应确保它按预期工作。

如果您实际发布页面并重新加载它...

在提交表单或刷新页面的情况下，值得注意的是，您的时间选择器在此过程中不会保留，并且需要在页面最初加载时重新实例化：

$(function(){
      // This will ensure that when the page loads, your timepicker works
      $('#txtTime').timepicker({ ... });
});
相关文章：