1

我正在尝试在我的 html 页面中使用 JQuery datepicker 和 Jotform。但似乎 jquery 和 jotform 毕竟不相处。

<script type="text/javascript" src="js/jquery.min.1.8.3.js"></script> 
<script src="js/jotform.js" type="text/javascript"></script>

如果我消除上述代码的第一行，则 jotform 工作正常，如果我消除第二行并保留第一行，则 datepicker 将正常工作。（Jotform 是一个在线表单生成器）

自 2011 年以来存在冲突记录，但我无法找到是否已解决。

  $(function() {

  //-----------------------------------
  // Show Picker
  $('#startDate').datepicker({
      showButtonPanel: true
  });
  //-----------------------------------
  // Show Picker
  $('#dueDate').datepicker({
      showButtonPanel: true
  });

 });

以下是我的代码部分的一部分

<link rel="stylesheet" type="text/css" href="css/jNotify.jquery.css" media="screen" />
<script type="text/javascript" src="js/jNotify.jquery.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script> 
<script src="js/jotform.js" type="text/javascript"></script>
<script type="text/javascript" src="js/ajax_load.js"></script>
<script type="text/javascript" src="js/validator.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.core.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.datepicker-cc.js"></script>
<script type="text/javascript" src="scripts/calendar.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.datepicker-cc-ar.js"></script>
<script type="text/javascript" src="scripts/jquery.ui.datepicker-cc-fa.js"></script>
<link type="text/css" href="styles/jquery-ui-1.8.14.css" rel="stylesheet" />

任何提示和帮助将不胜感激

4

2 回答 2

3

好的，这太大了，无法在评论中解释：

使用 jQuery noConflict 模式

http://api.jquery.com/jQuery.noConflict/

首先，在加载 jQuery 后添加 noConflict 脚本：

<!-- this is where you are loading jQuery -->
<script type="text/javascript" src="here/you/are/loading/jquery.js"></script>
<!-- and now lets enter in noConflict mode -->
<script type="text/javascript">
$.noConflict();
</script>

这样该$函数再次“免费”，因此其他库可以使用它（两个库不能使用相同的名称，它是一个全局变量，所以会发生狗屎）。

好吧，现在我们不会使用$jQuery。如果你想使用jquery，新的魔法词是jQuery（是的，很原始），例如：

jQuery("#menu").show();

因此，如果您必须使用 datepicker，只需替换$为jQuery. 例如：

jQuery('#startDate').datepicker({
    showButtonPanel: true
});

请记住，关键字$不再附加到 jQuery。所以你必须在jQuery任何地方使用。或者你也可以使用一个新的别名，例如如果你认为jQuery它太大了：

var j = jQuery.noConflict();
//and now we are going to use it:
j("#menu").show();

这里还有更多示例：http: //api.jquery.com/jQuery.noConflict/

于 2013-04-30T09:40:41.210 回答
0

只需使用自调用匿名函数并传递 jQuery 并将其作为 $ 在您的代码中捕获，例如：

 (function($){

  $(function() {

  //-----------------------------------
  // Show Picker
  $('#startDate').datepicker({
      showButtonPanel: true
  });
  //-----------------------------------
  // Show Picker
  $('#dueDate').datepicker({
      showButtonPanel: true
  });

});

})(jQuery);

并修改 jquery 脚本包含（与 TheBronx 建议的相同）：

<!-- this is where you are loading jQuery -->
<script type="text/javascript" src="here/you/are/loading/jquery.js"></script>
<!-- and now lets enter in noConflict mode -->
<script type="text/javascript">
$.noConflict();
</script>

这是使用最少代码更改的唯一方法。谢谢。

于 2013-08-12T19:29:44.603 回答