Question

您好我正在JSP中开发一个小应用程序。

我的想法是在用户在文本区域中键入时引用JSON元素。

例如：如果我的JSON包含：

CO 2， H2O， c9O

并且在文本区域中用户正在键入一个句子，一旦用户键入一个特殊字符，如@或\或/如果他/她写了“c”字符，我想要一个小的下拉列表出现在以c开头的两个元素。用户可以在之后选择元素，然后在发布表单时，我想提取从JSON输入的那些信息。

这就像你开始在Facebook上输入一个名字一样。

有什么想法吗？提前致谢

<form action="./Protocol" method="POST">
    <textarea rows=5 cols=50></textarea>
   <input type="submit"/></form>

$('textarea').textcomplete([{
match: /(^|\s)(\w{2,})$/,
search: function (term, callback) {
    var words = ['google', 'facebook', 'github', 'microsoft', 'yahoo'];
    callback($.map(words, function (word) {
        return word.indexOf(term) === 0 ? word : null;
    }));
},
replace: function (word) {
    return word + ' ';
}}]);

上面的JS Fiddle做了我想要的部分。

我想在这里完成的两件事之一 1.如果在JSON中，每个单词都有一个类似{"ID": "1","name": "GOOGLE"}的ID，我可以在发布表单时获取textarea中要发布的ID 2.或者只是数组索引号，如何在表单中单独发布textarea值。

Answer 1

好的，尽管我说的是，这里有一个基本的例子，说明你如何实现这个目标（因为我很无聊，但不是那么无聊，我会为你做这一切:)）：

HTML

<input id="input"/>
<div id="dropdown"></div>

JS

// grab the DOM elements
var input = document.getElementById('input');
var dropdown = document.getElementById('dropdown');

// assign an function to the onkeyup event for your input box
input.onkeyup = search;

// define your data structure
var arr = ['cO2', 'H2O', 'c9O'];

function search() {

  // get the content and length of the content
  // `this` in this instance refers to the element to which
  // we assigned the function
  var val = this.value;
  var len = val.length;

  // filter out the elements from the array that match
  // the content, or nothing if the input is empty
  dropdown.textContent = arr.filter(function(el) {
    return val !=='' ? el.substring(0, len) === val : '';
  });
}

DEMO

希望能帮到你。

在文本区域中插入json对象

1 个答案: