jQuery UI 函数在另一个函数中未定义

Question

我的一个页面上运行了 jQuery UI 的 datepicker 函数。把它剥离下来，它的工作原理是这样的：

<form>
    <input type="text" name="date" id="date" />
</form>
<script type="text/javascript">
    jQuery("#date").datepicker();
</script>

由于这部​​分有效，我知道正确包含 jQuery 和 jQuery UI 脚本等。

现在，我想从我的一个函数中激活日期选择器，如下所示：

<form>
    <input type="text" name="date" id="date" />
</form>
<a href="JavaScript:test();">test</a>
<script type="text/javascript">
    function test() {
        alert(jQuery("#date")); // this works as expected
        jQuery("#date").datepicker(); // this throws an error
    }
</script>

但是当 datepicker 函数在我的函数中运行时，JavaScript 会抛出错误 TypeError: 'undefined' is not a function (evalating 'jQuery("#date").datepicker()')。看起来 datepicker 函数在我的函数范围内不可用，即使 jQuery("#date") 对象可用。

有人对此有解释或解决方法吗？

更新：在 ragnarok56 发布了演示代码工作的 jsfiddle 之后，我回到我的页面更仔细地查看可能会影响它的内容。这是一个更大的系统的一部分，管理员可以通过添加他们自己的页眉和页脚代码来定制它，事实证明，管理员已经在页脚中添加了他自己的链接到一个旧的 jQuery 脚本。我删除了它，我的代码按预期工作。我还用他的替换了我的 jQuery 包含，我的代码仍然有效，所以问题似乎不是旧版本的 jQuery，而是两次包含 jQuery。这似乎很奇怪，这会阻止 jQuery 函数在函数内部而不是在函数外部工作，所以我会保持打开状态，以防有人可以提供对该行为的解释。

Answer 1

根据您的更新，问题是 jQuery 是在 jQuery UI 之后包含的。

当 jQuery UI 初始化时，它本质上是将自身构建到现有的 jQuery 代码中。如果在此之后包含另一个版本的 jQuery，原始的 jQuery（附带 jQuery UI！）将被丢弃。这就是为什么特定于 UI 的方法（如 datepicker）会抛出错误的原因。

只包含一次 jQuery 肯定更好，但在第二个 jQuery 实例之后包含 jQuery UI 再次将（可能）正常工作。

编辑：它在函数之外工作的原因很可能是它在 jQuery 的第二个副本覆盖第一个副本之前运行在那里。该函数可能稍后运行？