jquery 打破另一个 javascript答案

【问题标题】：jquery breaking another javascriptjquery 打破另一个 javascript
【发布时间】：2015-05-26 10:33:07
【问题描述】：

我正在使用一个带有 html 模板的日期选择器，一切正常，直到我使用自定义 jquery 使用单选按钮隐藏 div ...

这是我最喜欢的脚本

<script type='text/javascript' src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" ></script>
<script type='text/javascript' src='js/plugins/jquery/jquery-ui.min.js'></script>
<script type='text/javascript' src='js/plugins/jquery/jquery-migrate.min.js'></script>
<script type='text/javascript' src='js/plugins/jquery/globalize.js'></script>    
<script type='text/javascript' src='js/plugins/bootstrap/bootstrap.min.js'></script>
<script type='text/javascript' src='js/plugins/mcustomscrollbar/jquery.mCustomScrollbar.min.js'></script>
<script type='text/javascript' src='js/plugins/uniform/jquery.uniform.min.js'></script>
<script type='text/javascript' src='js/plugins/knob/jquery.knob.js'></script>
<script type='text/javascript' src='js/plugins/sparkline/jquery.sparkline.min.js'></script>
<script type='text/javascript' src='js/plugins/flot/jquery.flot.js'></script>     
<script type='text/javascript' src='js/plugins/flot/jquery.flot.resize.js'></script>
<script type='text/javascript' src='js/plugins.js'></script>    
<script type='text/javascript' src='js/actions.js'></script>    
<script type='text/javascript' src='js/charts.js'></script>
<script type='text/javascript' src='js/settings.js'></script>

如果我使用它，那么 datepicker 工作正常，但我的 jquery 不工作，我的 jquery 代码是

<script type="text/javascript">
    $(document).ready(function () {
        $("#vodn").trigger("click");
        $('#div1').hide('fast');
        $('#vod').click(function () {
            $('#div2').hide('fast');
            $('#div1').show('fast');
        });
        $('#vodn').click(function () {
            $('#div1').hide('fast');
            $('#div2').show('fast');
        });
    });
</script>

只有当我在我的 jquery 之前调用这个 jquery.min.js 时，我的 jquery 才能工作

<script type='text/javascript' src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" ></script>

但问题是我的自定义 jquery 正在工作，但 datepicker 不工作（可能是因为我调用 jquery.min.js 两次），我在做什么错误以及如何纠正它......

编辑：我观察到当我使用 noconflict 时，我导入 jquery.min.js 的地方会影响页面，如果我在 js/plugins.js 之前导入它，那么我的日期选择器是不工作，如果我在 plugins.js 之后导入它，那么我的自定义代码不工作

【问题讨论】：

把你自己的<script>标签和自定义代码放在所有其他脚本标签下面怎么样？并删除第二个jquery.min 脚本？
不工作，日期选择器工作，但我的自定义代码不工作
没有足够的信息，没有演示，没有错误日志；投票结束

标签： javascript jquery html jquery-ui datepicker

【解决方案1】：

在 jquery 脚本的第一行添加 noConflict

var $ = jQuery.noConflict();
$(document).ready(function () {
    $("#vodn").trigger("click");
    $('#div1').hide('fast');
    $('#vod').click(function () {
        $('#div2').hide('fast');
        $('#div1').show('fast');
    });
    $('#vodn').click(function () {
        $('#div1').hide('fast');
        $('#div2').show('fast');
    });
});

【讨论】：

nope 不工作，我观察到的一件事是，当我使用 noconflict 时，我导入 jquery 的地方会影响页面，如果我在 js/plugins.js 之前导入它，那么我的日期选择器不是工作，如果我在 plugins.js 之后导入它，那么我的自定义代码不起作用

【解决方案2】：

您的 jquery 文件有冲突。尝试执行以下操作：

var j = $.noConflict();

然后您通过变量j 初始化您的日期选择器。

例如。

j("#your-selector").datepicker();

【讨论】：

不，不走运，你能告诉我如何为我的自定义 js 做，我的意思是不使用冲突

【解决方案3】：

最好通过名称传递 jQuery 对象，然后在里面使用 $：

jQuery(document).ready(function($){
   ...
});

此外，您可能希望在加载 jQuery 后立即进行迁移，如果这不起作用，您应该发布控制台中显示的错误。

我们无法神奇地确定您未显示的脚本（html 和未显示）是有问题的。您可能使用 vod/vodn 来指代不存在的元素。

【讨论】：