提到输入不起作用答案

【问题标题】：mentionsInput does not work提到输入不起作用
【发布时间】：2017-02-22 12:37:25
【问题描述】：

我是mentionsInput 的新手，一直在尝试在一个简单的html 页面中实现。我收到错误 elmInputbox.elastic is not a function。

这是我的代码。

<html>
	<head>

	</head>
	<body>
		<textarea class='mention'></textarea>

		<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>
		<script src='./jmi/underscore-min.js' type='text/javascript'></script>
		<script src='./jmi/elastic.min.js' type='text/javascript'></script>
		<script src='./jmi/jquery.mentionsInput.js' type='text/javascript'></script>
		<script>
		
			  $('textarea.mention').mentionsInput({
    		onDataRequest:function (mode, query, callback) {
      var data = [
        { id:1, name:'Kenneth Auchenberg', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:2, name:'Jon Froda', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:3, name:'Anders Pollas', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:4, name:'Kasper Hulthin', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:5, name:'Andreas Haugstrup', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:6, name:'Pete Lacey', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:7, name:'kenneth@auchenberg.dk', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:8, name:'Pete Awesome Lacey', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' },
        { id:9, name:'Kenneth Hulthin', 'avatar':'http://cdn0.4dots.com/i/customavatars/avatar7112_1.gif', 'type':'contact' }
      ];

      data = _.filter(data, function(item) { return item.name.toLowerCase().indexOf(query.toLowerCase()) > -1 });

      callback.call(this, data);
    }
  });
		</script
	</body>
</html>

【问题讨论】：

您的提及输入插件可能丢失
我将mentionsInput zip 文件解压缩到jmi 文件夹中（从上面的代码可以看出）。在里面，是mentionsInput zip 文件的内容。我还对照podio.github.io/jquery-mentions-input 上给出的代码检查了代码
另外，当我点击mentionsInput.js 时，我可以看到javascript 文件。所以我相信这必须与 elastic.js
我做了一个解决方法。在mentionsInput.js 中，我将defaultsettings.elastic 设置为false。它工作正常。

标签： jquery mentionsinput.js

【解决方案1】：

您只需将 lib/jquery.elastic.js 与 jquery.mentionsInput.js 一起复制。如果您想让组件增长和缩小以适应其内容，这一点非常重要。（根据他们的documentation）在依赖项下。

【讨论】：