" TypeError:jQuery(...)。insertAfter(...)。slider不是函数"在Magento

时间:2015-12-10 06:33:04

标签: javascript jquery css magento magento-1.9

我想在点击它时显示图像弹出窗口。为此,我使用了这个lightbox-plus-jquery.min.js

请参阅以下链接

view-source:http://urbanior.grapesdigital.com/skin/frontend/rwd/default/js/lightbox-plus-jquery.min.js 

但问题是当我使用它时,发生TypeError: jQuery(...).insertAfter(...).slider is not a function错误并且页面中没有显示jquery滑块。

滑块代码

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
<script>
  jQuery(function() {
    var select2 = jQuery( "#minbeds2" );
     var slider_set2 = jQuery( ".slider_set2" );

    var slider = jQuery( "<div style='' id='slider3'></div>" ).insertAfter(slider_set2 ).slider({
      min: 1,
      max: 8,
      range: "min",
      value: select2[ 0 ].selectedIndex + 1,
     // value: select2[ 0 ].selectedIndex + <?php echo ($measurement_trouserwaist)?$measurement_trouserwaist:'1';?>,
      slide: function( event, ui ) {


        jQuery("#minbeds3")[0].selectedIndex = ui.value - 1;
        //select[ 0 ].selectedIndex = ui.value - 1;
        jQuery('.value6').html(ui.value + 29);
        jQuery("#f").css("display", "block");
         jQuery("#measure_waist").val(ui.value + 29 + "inch");
      }
    });

    min=30;
    max= 37;

        var array = [];

    for (var i = min; i <= max; i++) {
        array.push(i);
    }

        //Create and append select list
        var selectList2 = document.createElement("select");
        selectList2.setAttribute("id", "minbeds3");
        selectList2.setAttribute("name", "minbeds3");
        selectList2.setAttribute("class", "minbeds3");
        //document.getElementsByClassName("ui-slider-handle").appendChild(selectList);
        jQuery( "#slider3 .ui-slider-handle" ).html(selectList2);
        //Create and append the options
        for (var i = 0; i < array.length; i++) {
            var option2 = document.createElement("option");
            option2.setAttribute("value", array[i]);
    /*  if(array[i]=='<?php echo ($measurement_trouserwaist)?$measurement_trouserwaist:'1';?>'){
                option2.setAttribute("selected", 'selected'); 
                }  */
            option2.text = array[i];
            selectList2.appendChild(option2);
              document.getElementById("minbeds3").appendChild(option2);

        }

     jQuery( "#minbeds3" ).change(function() {
      slider.slider( "value", this.selectedIndex + 1 );
      jQuery('.value6').html(this.selectedIndex + 30);
      jQuery("#f").css("display", "block"); 
      jQuery("#measure_waist").val(this.selectedIndex + 30 + "inch");
    });

  });

  </script>

我尝试使用<script>jQuery.noConflict();</script>来解决此问题 但它仍然没有用。

0 个答案:

没有答案