堆栈内存溢出
  简体   繁体   English

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

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

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

问题描述

im trying to implement plupload into an existing template but am running into issues when adding the plupload JQuery file the existing template stops working like drop down menus and other features 我试图将plupload实现到现有模板中，但是在添加plupload JQuery文件时遇到了问题，现有模板停止工作，如下拉菜单和其他功能

this is the current head tags without the plupload files 这是没有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>

the below is the lines im trying to add when i run into problems and the template stops working 下面是我遇到问题并且模板停止工作时要添加的行 

<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'>

any help is very much appreciated im stuck currently and cannot work out how to proceed 非常感谢我目前停留的任何帮助，无法解决如何进行

code added thanks to below 代码添加到下面 

  <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

You need to use jQuery noConflict() Method. 您需要使用jQuery noConflict()方法。 The noConflict() method releases the hold on the $ identifier, so that other scripts can use it. noConflict()方法释放对$标识符的保留，以便其他脚本可以使用它。

In the below code we are using noConflict() just after including jquery js file, we are releasing $ which is a global function for jQuery to be used by others and we are using jQuery as an alias instead of $ . 在下面的代码中，我们在包括jquery js文件之后使用了noConflict() ，我们发布了$ ，这是供他人使用的jQuery的全局函数，并且我们使用jQuery作为别名而不是$ 。

You can have your custom variable declared as an alias when using noConflict() like var jq = $.noConflict(); 您可以在使用noConflict（）时将自定义变量声明为别名，例如var jq = $.noConflict(); . 。 Now you can access using jquery using jq alias. 现在，您可以使用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>

EDIT: 编辑：

User jQuery noconflict after this in your code not after plupload js. 之后，您的代码中的用户jQuery noconflict不在plupload js之后。 

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

Note: Now if you have written any jquery code in your application which is referencing jquery-1.10.2.min.js , replace $ by jQuery . 注意：现在，如果您在应用程序中编写了引用jquery-1.10.2.min.js任何jquery代码， jquery-1.10.2.min.js $替换$ jQuery 。

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

This is b'se plupload uses the old 1.9.0 jquery. 这是b'se的plupload使用旧的1.9.0 jquery。 I solved this by putting all pupload code above the tag that calls the later jQuery version then added a 我通过将所有加载代码放在调用更高版本jQuery的标签上方解决了此问题，然后添加了 

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

after the jQuery. jQuery之后。

eg 例如 

...
<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 $.post doesn't work with when function(response) added 从 jQuery.css() function 添加时 translateY 不起作用 - translateY doesn't work when added from jQuery .css() function 通过jQuery添加内容时Facebox无法正常工作吗？ - Facebox doesn't work when content is added via jQuery? 第二个追加不适用于jQuery - Second append doesn't work on jquery delay（）第二次jquery不起作用 - delay() doesn't work second time jquery 为什么plupload库在IE8中不起作用 - Why plupload library doesn't work in IE8 jQuery on（change）第二次不起作用 - jQuery on(change) doesn't work second time jquery命令在控制台上成功运行，但是在添加click（）时不起作用，但也未显示任何错误 - jquery command works successfully on console but does not work when click() is added but doesn't show any errors either jQuery on（）不适用于已添加的DOM项 - jQuery on() doesn't work on already added DOM items 触发器不适用于在.change jQuery上添加的动态内容 - Trigger doesn’t work for dynamic content added on .change jQuery
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM