如何解决Prototype和DataPicker或Tooltip之间的jQuery冲突？

Question

我的后端应用程序有问题。 我的表单中有数据字段，为此我正在使用插件jQuery DataPicker。 起初它工作正常-当我单击字段日历框时弹出。 问题是当我实际选择任何日期时，日历和日期字段会消失。

我在开发人员工具（或Firebug）中检查了此输入，然后注意到样式“显示：无”已添加到我的输入中。

我的代码如下所示：

的HTML

<head>
    // prototype version 1.7
    <script type="text/javascript" src="js/prototype.js"></script>
    <script src="js/jquery-2.1.1.js"></script>
    <script type="text/javascript">jQuery.noConflict();</script>
    <script src="js/bootstrap-datepicker.js"></script>
</head>
..
<div class="form-group" id="data_1">
    <label>Creation date</label> 
    <div class="input-group date">
        <input type="text" class="form-control valid" name="CreationDate" 
            id="CreationDate" value="29.09.2015" aria-invalid="false">
    </div>
</div>

后来：

...
<div class="input-group date" style="display: none;">
...

jQuery代码如下所示：

jQuery的

jQuery(document).ready(function ($) {
  ..                     
    $('#data_1 .input-group.date').datepicker({
      todayBtn: "linked",
      keyboardNavigation: false,
      forceParse: false,
      calendarWeeks: true,
      autoclose: true,
      format: "dd.mm.yyyy"
    });
  ..
});

当我禁用原型时，我的输入效果很好！ 然后，我启用原型，在这里我们再次进行。

我试图从原型中删除此方法

Element.Methods = {

   hide: function(element) {
      element = $(element);
      element.style.display = 'none';
      return element;
   }
}

我的DataPicker工作正常。 我无法删除此方法，因为页面上的其他功能不起作用。

ToolTip也存在类似问题。 当我将鼠标悬停在提示图标上时，将出现“工具提示”框，并且可以正确看到该消息。 但是，当我将光标移开时，工具提示和相关对象（再次设置为“显示：无”样式）都将移开。

我的页面上有jQuery.noConflict，它不能解决此问题。 我怎么解决这个问题？ 请帮我：）

Answer 1

在510行的datpicker javascript文件中

this._trigger('hide');

在此方法内部，它试图触发jQuery事件，因为jQuery处理事件和自定义事件的方式是，它将查看DOM对象上定义的方法，然后转到本机事件，然后进入自定义事件（我认为），因此它正在找到将样式设置为display:none的Element#hide()方法display:none

所以2个解决方案

评论那条线
如果使用的是hide事件，则将该事件重命名为其他名称。 我喜欢为事件命名，例如datepicker:hide

如何解决Prototype和DataPicker或Tooltip之间的jQuery冲突？

问题描述

1 个解决方案

解决方案1
0 2015-10-22 20:27:36

如何解决Prototype和DataPicker或Tooltip之间的jQuery冲突？

问题描述

1 个解决方案

解决方案1 0 2015-10-22 20:27:36

解决方案1
0 2015-10-22 20:27:36