当页面回发ASP.NET时，时间选择器javascript将停止工作

A timepicker javascript stops working when the page does postback ASP.NET

本文关键字：时间选择器 javascript 停止工作 NET ASP 更新时间：2023-09-26

我的page.aspx中有一个更新面板，在更新面板中我有一个带有引导时间选择器的文本框，我展示了一个示例：

      <asp:UpdatePanel runat="server" id="upd1">
                <ContentTemplate>
 <div class="form-group">
                    <div class="row col-md-12 col-md-offset-0">
                        <label class="control-label">Monday</label>                            
                    </div>
                </div>
                <div class="form-group col-md-3">
                    <div class="input-group bootstrap-timepicker timepicker input-sm">
                        <asp:TextBox runat="server" ID="txtFecIni_1" class="form-control input-small "></asp:TextBox>
                        <span class="input-group-addon "><i class="fa fa-clock-o"></i></span>
                    </div>
                </div>
                <div class="form-group col-md-3">
                    <div class="input-group bootstrap-timepicker timepicker input-sm">
                        <asp:TextBox runat="server" ID="txtFecFin_1" class="form-control input-small "></asp:TextBox>
                        <span class="input-group-addon "><i class="fa fa-clock-o"></i></span>
                    </div>
                </div>
              </ContentTemplate>
                </asp:UpdatePanel>

在我页面的</ form>下，我添加了以下javascript代码：

       <script type="text/javascript">
        window.onload = function () {
  $('#txtFecIni_1').timepicker({
                minuteStep: 30,
                defaultTime: false,
                showMeridian: false
            });
            $('#txtFecFin_1').timepicker({
                minuteStep: 30,
                defaultTime: false,
                showMeridian: false
            });
}
    </script>
    <script src="js/jquery-2.2.2.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="js/bootstrap-timepicker.js"></script>

时间选择器工作正常，直到对象被抛出autopostback。我该如何解决这个问题？谢谢

我用这种方式解决问题：

我将window.onload = function ()更改为function pageLoad()像这样：

之前：

     <script type="text/javascript">
        window.onload = function () {
  $('#txtFecIni_1').timepicker({
                minuteStep: 30,
                defaultTime: false,
                showMeridian: false
            });
            $('#txtFecFin_1').timepicker({
                minuteStep: 30,
                defaultTime: false,
                showMeridian: false
            });
}
    </script>

之后：

 <script type="text/javascript">
          function pageLoad() {
  $('#txtFecIni_1').timepicker({
                minuteStep: 30,
                defaultTime: false,
                showMeridian: false
            });
            $('#txtFecFin_1').timepicker({
                minuteStep: 30,
                defaultTime: false,
                showMeridian: false
            });
}
    </script>

我读到每次回发都会调用Pageload。希望这对

有帮助

这是由于asp.net控件的回发，这里是的解释

使用Sys.WebForms.PageRequestManage

你的代码会是这样的。。

<script>
                jQuery(document).ready(function () {
                       $('#txtFecIni_1').timepicker({
                    minuteStep: 30,
                    defaultTime: false,
                    showMeridian: false
                });
                $('#txtFecFin_1').timepicker({
                    minuteStep: 30,
                    defaultTime: false,
                    showMeridian: false
                    });
              });
                var prm = Sys.WebForms.PageRequestManager.getInstance();
                prm.add_endRequest(function () {

                       $('#txtFecIni_1').timepicker({
                    minuteStep: 30,
                    defaultTime: false,
                    showMeridian: false
                });
                $('#txtFecFin_1').timepicker({
                    minuteStep: 30,
                    defaultTime: false,
                    showMeridian: false
                    });
                });
            </script>