按文本輸入過濾，如何添加正則表達式？ - 香草JS

Question

我正在使用 Mixitup.js 和 vanilla Javascript。 這是一個有效的 JSFiddle 。

當您輸入“blue”、“green”或“pink”時，它只顯示具有該類名的元素。

我想要的是使用 ReGex 過濾結果，例如使用： new RegExp('^|\\\\s','gi') 。 但是，我不知道如何正確編寫它，也不知道如何將其實現到代碼中。

現在，當您輸入“reen”時，它仍會顯示“green”的結果。 我不要這個。 我只想要從單詞開頭匹配的結果（因此^| ）。

我保留了開發者演示腳本中的注釋，希望能有所幫助。完整演示在這里

謝謝你的幫助！

Answer 1

據我了解，您正在使用基於屬性的選擇器來選擇類以特定文本開頭的元素。 但是在您的示例中，元素有兩個類“混合”和顏色名稱

類=“混合綠色”

簡單地使用[class^=color class name ] 是行不通的。

嘗試更換

mix.filter('[class*="' + searchValue + '"]');

和

mix.filter('[class^="mix ' + searchValue + '"]');