Jquery自动完成 – 剥离标签以输入输入

我有以下jquery自动完成代码，它完美地工作：

$("#autoc1").autocomplete("/autoc2.php?arg=1&category=", { width: 400, matchContains: true, minChars: 3, selectFirst: false }); 

我使用PHP格式化数据以在自动完成中显示图像，为用户提供更好的信息用户界面，PHP代码是：

 $query = "SELECT $title, imageURL FROM PRprodINFO2 WHERE ((prodcatID = '$cat_id') AND ($title LIKE \"%" . $_GET["q"] . "%\")) group by $title LIMIT 8"; } $result = mysql_query($query); $output_items = array(); while($row = mysql_fetch_array($result)) { $row[$title] = preg_replace('/[^\w\s].*$/', "", $row[$title]); $row[$title] = trim($row[$title]); $output_items[$row['title']] = $row['imageURL']; } // while $output_items = array_unique($output_items); $output = ''; foreach ($output_items as $title => $image) { $output .= ''.$title."\n"; } echo $output; 

问题是JQuery自动完成代码也将标签数据推送到输入中。

有没有办法像这样格式化但只有输入框中没有的项目标题？

Answer 1

你可以通过覆盖某些核心function来扩展自动完成插件来实现这一点，主要是“解析”。 该函数的内部版本只是循环遍历返回数据的每一行，并将其“解析”为一个对象数组，每个对象包含以下属性：data – 整个条目值 – 默认显示值结果 – 填充数据的数据选择时的输入元素

您可以通过将自己的parse函数作为options对象的一部分传递给自动完成来覆盖它。

您还需要提供一个“formatItem”函数，使您有机会格式化自动完成下拉列表中显示的数据！

 var acOptions = { minChars: 3, max: 100, dataType: 'json', // this parameter is currently unused extraParams: { format: 'json' // pass the required context to the Zend Controller }, parse: function(data) { var parsed = []; data = data.users; for (var i = 0; i < data.length; i++) { parsed[parsed.length] = { data: data[i], value: data[i].displayName, result: data[i].displayName }; } return parsed; }, formatItem: function(item) { return item.displayName + ' (' + item.mail + ')'; } }; 

然后你可以调用并提供一个函数，可以在.result调用中按照你的要求删除图像，如下所示：

 jQuery(document).ready(function($) { $('#user_id') .autocomplete('/path/to/ajax/data/source', acOptions) .attr('name', 'display_name') .after('') .result(function(e, data) { $('#ac_result').val(data.uid); // remove the img here for your text field! }); }); 

希望这可以帮助！

Answer 2

试试这个 ：

 $img = $('img'); $img.replaceWith($img.html()); 

在这里阅读Jquery删除表单标记，而不是内容