如果向页面添加 jQuery 并注释掉缺少的插件引用，似乎不会出现错误。

var rules_basic = {
  condition: 'AND',
  rules: [{
    id: 'price',
    operator: 'less',
    value: 10.25
  }, {
    condition: 'OR',
    rules: [{
      id: 'category',
      operator: 'equal',
      value: 2
    }, {
      id: 'category',
      operator: 'equal',
      value: 1
    }]
  }]
};

$('#builder').queryBuilder({
 // plugins: ['bt-tooltip-errors'], not in the code/ cdn
  filters: [{
    id: 'name',
    label: 'Name',
    type: 'string'
  }, {
    id: 'category',
    label: 'Category',
    type: 'integer',
    input: 'select',
    values: {
      1: 'Books',
      2: 'Movies',
      3: 'Music',
      4: 'Tools',
      5: 'Goodies',
      6: 'Clothes'
    },
    operators: ['equal', 'not_equal', 'in', 'not_in', 'is_null', 'is_not_null']
  }, {
    id: 'in_stock',
    label: 'In stock',
    type: 'integer',
    input: 'radio',
    values: {
      1: 'Yes',
      0: 'No'
    },
    operators: ['equal']
  }, {
    id: 'price',
    label: 'Price',
    type: 'double',
    validation: {
      min: 0,
      step: 0.01
    }
  }, {
    id: 'id',
    label: 'Identifier',
    type: 'string',
    placeholder: '____-____-____',
    operators: ['equal', 'not_equal'],
    validation: {
      format: /^.{4}-.{4}-.{4}$/
    }
  }],
  rules: rules_basic
});


$('#btn-get').on('click', function() {
  var result = $('#builder').queryBuilder('getRules');
  if (!$.isEmptyObject(result)) {
    alert(JSON.stringify(result, null, 2));
  } else {
 //   console.log("invalid object :");
  }
 // console.log(result);
});

$('#btn-reset').on('click', function() {
  $('#builder').queryBuilder('reset');
});

$('#btn-set').on('click', function() {
  //$('#builder').queryBuilder('setRules', rules_basic);
  var result = $('#builder').queryBuilder('getRules');
  if (!$.isEmptyObject(result)) {
    rules_basic = result;
  }
});

//When rules changed :
$('#builder').on('getRules.queryBuilder.filter', function(e) {
  //$log.info(e.value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://querybuilder.js.org/assets/css/style.css" rel="stylesheet" />
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/npm/jQuery-QueryBuilder/dist/css/query-builder.default.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/query-builder.standalone.js"></script>

<div id="builder"></div>
<button class="btn btn-success" id="btn-set">Set Rules</button>
<button class="btn btn-primary" id="btn-get">Get Rules</button>
<button class="btn btn-warning" id="btn-reset">Reset</button>

在 codepen

这是 JavaScript

 $(function () {
           

            $('#builder').queryBuilder({
               

                operators: [
                    'equal', 'not_equal', 'is_null',
                    { type: 'contains_any', nb_inputs: 2, multiple: true, apply_to: ['string'] },
                ],

                filters: [{
                    id: 'name',
                    label: 'Name',
                    type: 'string',
                    operators: ['equal', 'not_equal', 'is_null']
                }, {
                    id: 'category',
                    label: 'Category',
                    type: 'integer',
                    input: 'select',
                    values: {
                        1: 'Books',
                        2: 'Movies',
                        3: 'Music',
                        4: 'Tools',
                        5: 'Goodies',
                        6: 'Clothes'
                    },
                    operators: ['equal', 'not_equal', 'contains_any']
                },
                ]
            });
        });