javascript - 同时使用jquery1.9.1和jqueryui1.10.2？

Question

我正在使用 jquery1.9.1 和 jqueryui 1.10.2，如下所示:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

使用:

$(document).ready(function(){ 
// my code here
});

我像这样使用 AJAX:

$('.formu').fadeOut("slow", function(){
    $.ajax({
        type: "GET",
        url: './php/calc.php?id=1000',
        dataType: "json",
        success: function(data){
            alert("hello");
            // jQueryUI component below
            $("#sliderui").slider({
               range: "min",
               min: 1,
               max: data.maxi,
               value: data.valu
            });
        },
        error: function(){
            errorcalculo();
        }
    });
});

我看到两次带有“hello”的警报...所以我搜索了问题，可能是因为两个库之间存在冲突。 然后我输入这段代码:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>var jQuery132 = $.noConflict(true);</script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

使用:

$(document).ready(function(){ 
// my code here
})(jQuery132);

最后像这样修改 AJAX:

jQuery132('.formu').fadeOut("slow", function(){
    jQuery132.ajax({
        type: "GET",
        url: './php/calc.php?id=1000',
        dataType: "json",
        success: function(data){
            alert("hello");
            // jQueryUI component below
            $("#sliderui").slider({
               range: "min",
               min: 1,
               max: data.maxi,
               value: data.valu
            });
        },
        error: function(){
            errorcalculo();
        }
    });
});

但恐怕代码也不起作用...... 我做错了什么？

如果您需要更多信息，请告诉我，我将编辑该帖子。

Answer 1

最简单的是使用检查条件..

var check = false;
jQuery132('.formu').fadeOut("slow", function(){ 
   if(!check) {
     jQuery132.ajax({
        type: "GET",
        url: './php/calc.php?id=1000',
        dataType: "json",
        success: function(data){
            alert("hello");
            // jQueryUI component below
            $("#sliderui").slider({
               range: "min",
               min: 1,
               max: data.maxi,
               value: data.valu
            });
        },
        error: function(){
            errorcalculo();
        },
        complete: function() {
           check = true;
        }
    });
  }
});

或者看起来可能存在未定义 slider 的情况..所以最好使用该条件..

var $slider = $("#sliderui");
jQuery132('.formu').fadeOut("slow", function(){ 
   if(!$slider.hasClass('ui-slider')) {
      jQuery132.ajax({
        type: "GET",
        url: './php/calc.php?id=1000',
        dataType: "json",
        success: function(data){
            alert("hello");
            // jQueryUI component below
            $slider .slider({
               range: "min",
               min: 1,
               max: data.maxi,
               value: data.valu
            });
        },
        error: function(){
            errorcalculo();
        }
    });
  }
});

<强> Check Fiddle