javascript - この JQuery エラーが発生するのはなぜですか: $(".left_hand_icon").button is not a function

Question

これは私のjsコードです:

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.core.js"></script>
    <script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.slide.js"></script>

    <script src="js/mr_lp_minimizr.js"></script>
    <script>
$(document).ready(function(){

if(!Modernizr.input.placeholder){

    $('[placeholder]').focus(function() {
      var input = $(this);
      if (input.val() == input.attr('placeholder')) {
        input.val('');
        input.removeClass('placeholder');
      }
    }).blur(function() {
      var input = $(this);
      if (input.val() == '' || input.val() == input.attr('placeholder')) {
        input.addClass('placeholder');
        input.val(input.attr('placeholder'));
      }
    }).blur();
    $('[placeholder]').parents('form').submit(function() {
      $(this).find('[placeholder]').each(function() {
        var input = $(this);
        if (input.val() == input.attr('placeholder')) {
          input.val('');
        }
      })
    });

}

});
</script>
<script type="text/javascript">
jQuery.fn.extend({
  slideRightShow: function(speed) {
    return this.each(function() {
        $(this).show('slide', {direction: 'right'}, +speed || 1000);
    });
  },
  slideLeftHide: function(speed) {
    return this.each(function() {
      $(this).hide('slide', {direction: 'left'}, +speed || 1000);
    });
  },
  slideRightHide: function(speed) {
    return this.each(function() {
      $(this).hide('slide', {direction: 'right'}, +speed || 1000);
    });
  },
  slideLeftShow: function(speed) {
    return this.each(function() {
      $(this).show('slide', {direction: 'left'}, +speed || 1000);
    });
  }
});


$(document).ready(function () {
    $("#slides :first-child").addClass("currentSlide");
    $("#slides :not(:first-child)").hide();

    $(".left_hand_icon").button().click(function () { //This is the line where issue is
        currentSlide = $("#slides .currentSlide");

        if(currentSlide.prev().prev().size() < 1) {
            // The incoming slide is the first - disable Left button
            $(".left_hand_icon").button("disable");
        }

        currentSlide.prev().addClass("currentSlide");
        currentSlide.removeClass("currentSlide");

        currentSlide.prev().slideLeftShow();
        currentSlide.slideRightHide();

        $(".right_hand_icon").button("enable");
    }).button("disable");

    $(".right_hand_icon").button().click(function () {
        currentSlide = $("#slides .currentSlide");

        if(currentSlide.next().next().size() < 1) {
            // The incoming slide is the last - disable Right button
            $(".right_hand_icon").button("disable");
        }

        currentSlide.next().addClass("currentSlide");
        currentSlide.removeClass("currentSlide");

        currentSlide.next().slideRightShow();
        currentSlide.slideLeftHide();

        $(".left_hand_icon").button("enable");
    });
});
</script>

エラーが表示されている行に次のコメントを追加します。

Answer 1

jQuery ui ウィジェットが含まれていません。ボタンのあるところです。

http://api.jqueryui.com/category/widgets/