堆栈内存溢出
  繁体   English   中英

多个jQuery-当添加第二个jQuery库时，Plupload不起作用

[英]Multiple jQuery - Plupload doesn't work when second jQuery library added

 原文  2015-09-15 07:04:14  4   2    javascript/ jquery/ plugins

问题描述

我试图将plupload实现到现有模板中，但是在添加plupload JQuery文件时遇到了问题，现有模板停止工作，如下拉菜单和其他功能

这是没有plupload文件的当前head标签 

<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0' />
<title>$capital_name</title>
<link href='bootstrap/css/bootstrap.min.css' rel='stylesheet' type='text/css' />

<!-- jQuery UI -->
<!--<link href='plugins/jquery-ui/jquery-ui-1.10.2.custom.css' rel='stylesheet' type='text/css' />-->
<!--[if lt IE 9]>
    <link rel='stylesheet' type='text/css' href='plugins/jquery-ui/jquery.ui.1.10.2.ie.css'/>
<![endif]-->
<link href='assets/css/main.css' rel='stylesheet' type='text/css' />
<link href='assets/css/plugins.css' rel='stylesheet' type='text/css' />
<link href='assets/css/responsive.css' rel='stylesheet' type='text/css' />
<link href='assets/css/icons.css' rel='stylesheet' type='text/css' />
<link rel='stylesheet' href='assets/css/fontawesome/font-awesome.min.css'>
<!--[if IE 7]>
    <link rel='stylesheet' href='assets/css/fontawesome/font-awesome-ie7.min.css'>
<![endif]-->
<!--[if IE 8]>
    <link href='assets/css/ie8.css' rel='stylesheet' type='text/css' />
<![endif]-->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>

<script type='text/javascript' src='assets/js/libs/jquery-1.10.2.min.js'></script>
<script type='text/javascript' src='plugins/jquery-ui/jquery-ui-1.10.2.custom.min.js'></script> 
<script type='text/javascript' src='bootstrap/js/bootstrap.min.js'></script>
<script type='text/javascript' src='assets/js/libs/lodash.compat.min.js'></script>
<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
    <script src='assets/js/libs/html5shiv.js'></script>
<![endif]-->
<script type='text/javascript' src='plugins/touchpunch/jquery.ui.touch-punch.min.js'></script>
<script type='text/javascript' src='plugins/event.swipe/jquery.event.move.js'></script>
<script type='text/javascript' src='plugins/event.swipe/jquery.event.swipe.js'></script>
<script type='text/javascript' src='assets/js/libs/breakpoints.js'></script>
<script type='text/javascript' src='plugins/respond/respond.min.js'></script> <!-- Polyfill for min/max-width CSS3 Media Queries (only for IE8) -->
<script type='text/javascript' src='plugins/cookie/jquery.cookie.min.js'></script>
<script type='text/javascript' src='plugins/slimscroll/jquery.slimscroll.min.js'></script>
<script type='text/javascript' src='plugins/slimscroll/jquery.slimscroll.horizontal.min.js'></script>
<!--[if lt IE 9]>
    <script type='text/javascript' src='plugins/flot/excanvas.min.js'></script>
<![endif]-->
<script type='text/javascript' src='plugins/sparkline/jquery.sparkline.min.js'></script>
<script type='text/javascript' src='plugins/flot/jquery.flot.min.js'></script>
<script type='text/javascript' src='plugins/flot/jquery.flot.tooltip.min.js'></script>
<script type='text/javascript' src='plugins/flot/jquery.flot.resize.min.js'></script>
<script type='text/javascript' src='plugins/flot/jquery.flot.time.min.js'></script>
<script type='text/javascript' src='plugins/flot/jquery.flot.growraf.min.js'></script>
<script type='text/javascript' src='plugins/easy-pie-chart/jquery.easy-pie-chart.min.js'></script>
<script type='text/javascript' src='plugins/daterangepicker/moment.min.js'></script>
<script type='text/javascript' src='plugins/daterangepicker/daterangepicker.js'></script>
<script type='text/javascript' src='plugins/blockui/jquery.blockUI.min.js'></script>
<script type='text/javascript' src='plugins/fullcalendar/fullcalendar.min.js'></script>
<script type='text/javascript' src='plugins/noty/jquery.noty.js'></script>
<script type='text/javascript' src='plugins/noty/layouts/top.js'></script>
<script type='text/javascript' src='plugins/noty/themes/default.js'></script>
<script type='text/javascript' src='plugins/uniform/jquery.uniform.min.js'></script>
<script type='text/javascript' src='plugins/select2/select2.min.js'></script>
<script type='text/javascript' src='assets/js/app.js'></script>
<script type='text/javascript' src='assets/js/plugins.js'></script>
<script type='text/javascript' src='assets/js/plugins.form-components.js'></script>
<script>
$(document).ready(function(){
    'use strict';

    App.init(); // Init layout and core plugins
    Plugins.init(); // Init all plugins
    FormComponents.init(); // Init all form-specific plugins
});
</script>
<script type='text/javascript' src='assets/js/custom.js'></script>
<script type='text/javascript' src='assets/js/demo/pages_calendar.js'></script>
<script type='text/javascript' src='assets/js/demo/charts/chart_filled_blue.js'></script>
<script type='text/javascript' src='assets/js/demo/charts/chart_simple.js'></script>

下面是我遇到问题并且模板停止工作时要添加的行 

<script type='text/javascript' src='assets/plupload/jquery.js'></script>
<script type='text/javascript' src='assets/plupload/plupload.full.min.js'></script>
<script type='text/javascript' src='assets/plupload/jquery.plupload.queue.min.js'></script>
<link type='text/css' rel='stylesheet' href='assets/plupload/jquery.plupload.queue.css' media='screen'>

非常感谢我目前停留的任何帮助，无法解决如何进行

代码添加到下面 

  <script src='assets/plupload/jquery.js'></script> <script> $.noConflict(); jQuery(document).ready(function(){ jQuery('button').click(function(){ jQuery('p').text('jQuery is still working!'); }); }); </script>

2 个解决方案

解决方案1
 1 已采纳  2015-09-15 07:22:06

您需要使用jQuery noConflict()方法。 noConflict()方法释放对$标识符的保留，以便其他脚本可以使用它。

在下面的代码中，我们在包括jquery js文件之后使用了noConflict() ，我们发布了$ ，这是供他人使用的jQuery的全局函数，并且我们使用jQuery作为别名而不是$ 。

您可以在使用noConflict（）时将自定义变量声明为别名，例如var jq = $.noConflict(); 。 现在，您可以使用jq别名使用jquery进行访问。 

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$.noConflict();
jQuery(document).ready(function(){
    jQuery("button").click(function(){
        jQuery("p").text("jQuery is still working!");
    });
});
</script>
</head>
<body>

<p>The noConflict() method releases the hold on the $ shortcut identifier, so that other scripts can use it.</p> 

</body>
</html>

编辑：

之后，您的代码中的用户jQuery noconflict不在plupload js之后。 

<script type='text/javascript' src='assets/js/libs/jquery-1.10.2.min.js'></script>
<script>
$.noConflict();
</script>

注意：现在，如果您在应用程序中编写了引用jquery-1.10.2.min.js任何jquery代码， jquery-1.10.2.min.js $替换$ jQuery 。

解决方案2
 0  2017-05-26 04:15:26

这是b'se的plupload使用旧的1.9.0 jquery。 我通过将所有加载代码放在调用更高版本jQuery的标签上方解决了此问题，然后添加了 

<script>
$.noConflict();
</script>

jQuery之后。

例如 

...
<script type='text/javascript' src='assets/plupload/jquery.js'></script>
<script type='text/javascript' src='assets/plupload/plupload.full.min.js'></script>
<script type='text/javascript' src='assets/plupload/jquery.plupload.queue.min.js'></script>
<link type='text/css' rel='stylesheet' href='assets/plupload/jquery.plupload.queue.css' media='screen'>
...
<script type='text/javascript' src='assets/js/libs/jquery-1.10.2.min.js'></script>
<script>
$.noConflict();
</script>
...

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 jQuery $ .post在添加功能（响应）时不起作用 从 jQuery.css() function 添加时 translateY 不起作用 通过jQuery添加内容时Facebox无法正常工作吗？ 第二个追加不适用于jQuery delay（）第二次jquery不起作用 为什么plupload库在IE8中不起作用 jQuery on（change）第二次不起作用 jquery命令在控制台上成功运行，但是在添加click（）时不起作用，但也未显示任何错误 jQuery on（）不适用于已添加的DOM项 触发器不适用于在.change jQuery上添加的动态内容
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM