javascript - 未指定输入节点。使用 YUI 库时

Question

我正在开发一个项目，并尝试使用 YUI 库通过输入过滤词来过滤列表中的结果，问题是有时这个工作正常，有时它只是崩溃说:未捕获错误:否指定输入节点。

这是我的 JS 函数:

YUI(YUI3_config).use('autocomplete-base', 'autocomplete-filters', function (Y) {
// Create a custom PieFilter class that extends AutoCompleteBase.
var PieFilter = Y.Base.create('pieFilter', Y.Base, [Y.AutoCompleteBase], {
  initializer: function () {
  this._bindUIACBase();
  this._syncUIACBase();
  }
}),

// Create and configure an instance of the PieFilter class.
filter = new PieFilter({
inputNode: '#ac-input20',
minQueryLength: 0,
queryDelay: 0,

source: (function () {
  var results = [];

  Y.all('#list31 > .list31, #list31 > .list32').each(function (node) {
    results.push({
      node: node,
      tags: node.getAttribute('data-tags')
    });;
  });

  return results;
  }), 
  resultTextLocator: 'tags',

  resultFilters: 'phraseMatch'
});

filter.on('results', function (e) {
Y.all('#list31 > .list31, #list31 > .list32').addClass('hidden');

   Y.Array.each(e.results, function (result) {
   result.raw.node.removeClass('hidden');
 });

}); });

这是我的 HTML :

<div id="play30" class="liste-donnees block ezcca-edit-datatype-ezdate">
<fieldset>
    <legend>
        <span class="long-legend-wrap">Ressources
            <span class="classattribute-description"></span>
        </span>
    </legend>
    <div style='width: 400px;'>
        <label for="ac-input20">Filtre:</label>
        <input id="ac-input20" type="text">
        <ul id="list31" class="liste-gauche"></ul>
    </div>    
    <p style='float: left;margin-top: 150px;font-weight: bold'>=====></p>
    <ul id="list32" class="liste-droite"></ul>    
</fieldset>

任何想法，提前感谢您的帮助

Answer 1

通常，“未指定 inputNode。”当找不到指定的输入(即“#ac-input20”)时会抛出错误。

显然，这在这里听起来很愚蠢，因为它已经在 HTML 中声明了；发生错误时，您是否检查了 HTML 源代码以确保“ac-input20”元素存在？

此外，您的目标是“#list31 > .list31”元素，但在 HTML 中，没有元素具有名为“list31”的类。

希望这对您有所帮助。