隐藏字符串的一部分，但使其可搜索

Question

我正在用chosen作为智能手机的列表。它们要么是三星、HTC、摩托罗拉，要么是LG，所以它们都含有这个品牌。

整个名字很长，看起来很糟糕，因为我的宽度是有限的。我如何允许用户搜索“三星银河”，但隐藏“三星”部分？

这是我现在的代码(不包括品牌)。我一直试图在没有显示字符串的情况下选择搜索给定的字符串，但是我找不到任何解决办法。

<optgroup label="Acer">
    <option value="acer-iconia-tab-a100">Iconia Tab A100</option>
</optgroup>
<optgroup label="Amazon">
    <option value="amazon-kindle-fire">Kindle Fire</option>
    <option value="amazon-kindle-fire-2">Kindle Fire HD</option>
</optgroup>
<optgroup label="Asus">
    <option value="asus-transformer-tf300t">Transformer TF300T</option>
</optgroup>
<optgroup label="Google">
    <option value="google-glass">Glass</option>
    <option value="google-nexus-10">Nexus 10</option>
    <option value="google-nexus-4">Nexus 4</option>
    <option value="google-nexus-5">Nexus 5</option>
    <option value="google-nexus-7">Nexus 7</option>
    <option value="google-nexus-7-2013">Nexus 7 2013</option>
    <option value="google-nexus-q">Nexus Q</option>
    <option value="sprint-nexus-s-4g">Sprint Nexus S 4G</option>
</optgroup>
<optgroup label="HP"></optgroup>

谢谢！

Answer 1

可以将数据值添加到选项中：

<option value='samsung-galaxy-s4' data-name='Samsung Galaxy S4'> Galaxy S4 </option>

然后根据这个值进行搜索。