JQuery查询生成器不工作

snvhrwxg  于 2023-02-03  发布在  jQuery
关注(0)|答案(1)|浏览(109)

我在我的HTML页面中使用JQuery QueryBuilder。我已经按照安装指南进行了操作。我的HTML头包括以下内容

<script src="bower_components/jquery/dist/jquery.min.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
    <script src="bower_components/moment/moment.js"></script>
    <script src="bower_components/jquery-extendext/jQuery.extendext.js"></script>
    <link href="bower_components/bootstrap/dist/css/bootstrap.css" rel="stylesheet" type="text/css" />
    <link href="bower_components/jQuery-QueryBuilder/dist/css/query-builder.default.css" rel="stylesheet" type="text/css" />
    <script src="bower_components/jQuery-QueryBuilder/dist/js/query-builder.standalone.js"></script>

我的身体

<div id="builder"></div>

但是当我使用

<script>
  $('#builder').queryBuilder({
    filters: [ ... ]
  });
</script>

我的Chrome主机显示

query-builder.standalone.js:437 Uncaught TypeError: Cannot set property 'queryBuilder' of undefined

我所有的bower组件都安装正确。
我哪里做错了?

gojuced7

gojuced71#

将脚本移动到builder div元素下方

<div id="builder"></div>

<script>
  $('#builder').queryBuilder({
    filters: [{id:1}] // You need to implement this
  });
</script>

或者使用Jquery document.ready

$(document).ready(function(){
    $('#builder').queryBuilder({
        filters: [{id:1}] // You need to implement this
    });
  })

相关问题