javascript - 我怎样才能执行两个javascript函数

Question

我是 HTML、PHP 新手。我已经使用以下编码构建了一个页面 -

<script src="js/jquery.min.js"></script>
<script src="js/timepicki.js"></script>
<link rel="stylesheet" type="text/css" href="css/timepicki.css">
<script>
$(document).ready(function (){
$(".time_element").timepicki();
});
</script>
<script src="jquery-1.6.2.min.js"></script>
<script src="jquery-ui-1.8.15.custom.min.js"></script>
<link rel="stylesheet" type="text/css" href="jqueryCalendar.css">
<script>

   jQuery(function () {
      jQuery( "#datepicker" ).datepicker();
      jQuery( "#datepicker1" ).datepicker();
});
 </script>    

问题是只有第二个可以工作。如果我将第一部分放在第二部分的位置，它也可以工作，但两者放在一起就不行了。我怎样才能将这些结合起来。我尝试了“body onload”方法，也尝试了“addloadevent”，但可能我没有正确编写代码。任何帮助将不胜感激。

Answer 1

您不止一次包含 jQuery。不要那样做。只需包含一次，然后包含您的插件。您可以留下您的ready block 分开，或组合它们，这取决于你。

以下是我要改变的方法:

在 head :

<link rel="stylesheet" type="text/css" href="css/timepicki.css">
<link rel="stylesheet" type="text/css" href="jqueryCalendar.css">

在 body在结束前的最后</body>标签:

<script src="js/jquery.min.js"></script>
<script src="js/timepicki.js"></script>
<script src="jquery-ui-1.8.15.custom.min.js"></script>
<script>
$(".time_element").timepicki();
$("#datepicker, #datepicker1" ).datepicker();
</script>

...哪里jquery.min.js是 jQuery 的最新版本，例如 v1.11.2。

或者如果您想要 head 中的所有脚本(尽管这通常不是最佳实践):

<link rel="stylesheet" type="text/css" href="css/timepicki.css">
<link rel="stylesheet" type="text/css" href="jqueryCalendar.css">
<script src="js/jquery.min.js"></script>
<script src="js/timepicki.js"></script>
<script src="jquery-ui-1.8.15.custom.min.js"></script>
<script>
jQuery(function($) {
  $(".time_element").timepicki();
  $("#datepicker, #datepicker1" ).datepicker();
});
</script>

我可能会做出的其他更改:

• 给#datepicker和#datepicker1一个普通类而不是 id s(与您的 .time_element 一样)。

• 将 CSS 合并到一个缩小的文件中。

• 将 JS 合并到一个缩小的文件中(或者可能是除 jQuery 之外的所有 JS，并从 CDN 加载 jQuery)。