Question

我有一个名为 index.php 的页面，此页面只是一个菜单和一个id为index_work的div。单击菜单中的任何项目时，我使用加载方法加载名为 relatorios.php 的第二页。

页面 relatorios.php 使用插件jquery datepicker。这是两个页面中的一些代码：

的index.php：

<ul class="sidebar-nav">
  <li class="sidebar-brand">
    <a href="#"> Menu Title </a>
  </li>
  <li>
    <a href="#" id="linkInformativos">Informativos</a>
  </li>
  <li>
    <a href="#" id="linkRelatorios"> Relatórios </a>
  </li>
</ul>

<div id="index_work"></div>

<script type="text/javascript">

$("#linkRelatorios").click(function(){
  $("#index_work").load("relatorios.php"); 
});

</script>

relatorios.php：

<!-- jqueryui datepicker -->
    <link rel="stylesheet" type="text/css" href="../plugin/jquery-ui/datepicker.min.css">   
    <script type="text/javascript" src="../plugin/jquery-ui/datepicker.min.js"></script>

<input type="text" id="dataAtendimentos" >

<script type="text/javascript">

  $("#dataAtendimentos").datepicker();

  //some other JavaScript that always work
</script>

如果我继续浏览器并输入整个地址：“localhost / myproject / relatorios.php 一切都有效。

如果我转到 index.php 并点击菜单加载 relatorios.php ，插件日期选择工具仅在我第一次点击菜单时有效，剩下的就是输入的时间用作文本，而不是日期选择器。

所以这些是步骤：

转到index.php
点击菜单项linkRelatorios（此处页面 relatorios.php 已加载，一切正常
点击菜单项linkInformativos（另一个页面加载在div上，工作正常）
再次点击菜单项linkRelatorios（页面 relatorios.php 已加载，一切正常，但datepicker插件除外）

我做错了什么？

Answer 1

您可以尝试在relatorios.php

中的$(document).ready()中包装代码

$(function() {
   $("#dataAtendimentos").datepicker();
})

在您调用datepicker时，DOM可能尚未加载。

当jquery load方法调用页面时，插件不起作用

1 个答案: