未捕获的TypeError:$(...)。leanModal不是HTMLDocument的函数。<anonymous>

时间:2017-07-13 21:46:22

标签: javascript jquery css laravel materialize

我正在使用Materialise css库和laravel来创建Survey应用程序: 这是我的HTML代码:

<div id="doDelete" class="modal bottom-sheet">
        <div class="modal-content">
          <div class="container">
            <div class="row">
              <h4>Are you sure?</h4>
              <p>Do you wish to delete this survey called "{{ $survey->title }}"?</p>
              <div class="modal-footer">
                <a href="/survey/{{ $survey->id }}/delete" class=" modal-action waves-effect waves-light btn-flat red-text">Yep yep!</a>
                <a class=" modal-action modal-close waves-effect waves-light green white-text btn">No, stop!</a>
              </div>
            </div>
          </div>
        </div>
      </div>

和init.js代码:

$(document).ready(function() {
  $('.collapsible').collapsible({
    accordion: false
  });

 $('.modal-trigger').leanModal();

  $(document).on('click', '.delete-option', function() {
    $(this).parent(".input-field").remove();
  });

但尝试执行删除功能时出现此错误

init.js:6 Uncaught TypeError: $(...).leanModal is not a function
    at HTMLDocument.<anonymous> (init.js:6)
    at j (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at Function.ready (jquery.min.js:2)
    at HTMLDocument.I (jquery.min.js:2)

我还包括init.js和jquery.min.js

 <script src="{{ URL::asset('jquery.min.js') }}"></script>
    {!! MaterializeCSS::include_js() !!}
    <script src="{{ URL::asset('init.js') }}"></script>

任何帮助请!!感谢。

1 个答案:

答案 0 :(得分:0)

               <section class="new">
                    <center><h2 class="text center">RECENT-PROJECT</h2></center>
                    <div id="carousel">
                            <img src="carousel 11.jpg" id="item-11"/>
                            <img src=" carousel image4.jpg" id="item-4"/>
                            <img src="image8.jpg" id="item-8"/>
                            <img src="image9.jpg" id="item-9"/>
                             <img src="image13.jpg" id="item-13"/>
                             <img src="image15.jpg" id="item-15"/>
                             <img src="images 12.jpg" id="item-12"/>
                             <img src="images 14.jpg" id="item-14"/>
                             <img src="image16.jpg" id="item-9"/>
                        </div>

                        <script>
                                $(document).ready(function () {
                                  var carousel = $("#carousel").waterwheelCarousel({
                                    flankingItems: 3,
                                  });

                                  $('#prev').bind('click', function () {
                                    carousel.prev();
                                    return false
                                  });

                                  $('#next').bind('click', function () {
                                    carousel.next();
                                    return false;
                                  });
                                });
                            </script>
                    </section>