0

我有一个带有 3 个滑块和一个弹出框的网页。
对于我使用的滑块jQuery.noConflict(),它工作正常。
但是在弹出框的情况下,如果我使用jQuery.noConflict()它不起作用。
如果我不使用,jQuery.noConflict()那么我的滑块将无法工作。

弹出html

<div id="popupContact">
  <a id="popupContactClose"><img src="close.gif" alt="close"/></a>
  <div id="contactArea"></div>
</div>
<div id="backgroundPopup"></div>

弹出jQuery

var popupStatus = 0;
function loadPopup(){
  if(popupStatus==0){
    $("#backgroundPopup").css({
        "opacity": "0.2"
    });
    $("#backgroundPopup").fadeIn("slow");
    $("#popupContact").fadeIn("slow");
    popupStatus = 1;
  }
}

function disablePopup(){
  if(popupStatus==1){
    $("#backgroundPopup").fadeOut("slow");
    $("#popupContact").fadeOut("slow");
    popupStatus = 0;
  }
}

function centerPopup(){
  var windowWidth = document.documentElement.clientWidth;
  var windowHeight = document.documentElement.clientHeight;
  var popupHeight = $("#popupContact").height();
  var popupWidth = $("#popupContact").width();
  $("#popupContact").css({
    "position": "absolute",
    "top": windowHeight/2-popupHeight/2,
    "left": windowWidth/2-popupWidth/2
  });
  $("#backgroundPopup").css({
    "height": windowHeight
  });
}

var $rp = jQuery.noConflict();
$rp(document).ready(function(){ 
  $rp("#buttonpop").click(function(){
    centerPopup();
    loadPopup();
  });
  $rp("#popupContactClose").click(function(){
    disablePopup();
  });
  $rp("#backgroundPopup").click(function(){
    disablePopup();
  });
  $rp(document).keypress(function(e){
    if(e.keyCode==27 && popupStatus==1){
        disablePopup();
    }
 });
});

注意: 这个弹出 jquery 是一个外部 jquery,我<script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script>也在使用。

谢谢你。

4

1 回答 1

2

如果您使用jQuery.noConflict(),这会阻止 jQuery 别名jQuery$. 但是,您的弹出代码仍在尝试使用$.

要么引用jQuery,要么不$,或者将您的代码包装在一个闭包中,并将引用$作为闭包内的局部变量,即

(function($) {
    //popup code here
})(jQuery);
于 2012-08-02T12:00:40.683 回答