複数選択のブートストラップピッカーがあり、選択したばかりの特定のオプションを見つけたいと思います。たとえば、ピッカーを次のように設定している場合:

<select class="form-select selectpicker" multiple aria-label="Default example">
<option value="Apple">Apple</option>
<option value="Cherry">Cherry</option>
<option value="Papaya">Papaya</option>
<option value="Kiwi">Kiwi</option>
</select>

ユーザーが最初のオプション「チェリー」を選択したら、アラート(「チェリー」)を行います。次に、ユーザーが2番目のオプションである「Apple」を選択したときに、アラート(「Apple」)を行います。

option:selected:last valueを使用しようとしましたが、これは、選択されたオプションの配列の最後のオプションを表示する場合にのみ機能します。選択したオプションの配列内の位置に関係なく、最後に選択したオプションを表示したいと思います。どんな洞察も大歓迎です。

編集:この質問は、ここにある質問と同様にマークされているため閉じられました:JavaScriptを使用してドロップダウンリストで選択された値を取得します

そのリンクで提供されたすべての回答を調べた後、質問が同じであるとは確信していません。1回の選択で選択された唯一のオプションではなく、複数選択ピッカーで最後に選択されたテキストを取得したいと思います。したがって、ユーザーがAppleとPapayaの両方のオプションを選択しているが、Papayaオプションを選択した後にAppleオプションを選択した場合は、アラート( "Apple")を行います。ありがとう。

応答

Alertを使用できる2つの方法を次に示します。
最初の方法:OnChangeを使用

<select class="form-select selectpicker" multiple aria-label="Default example" onchange = "alert(this.value)">
<option value="Apple">Apple</option>
<option value="Cherry">Cherry</option>
<option value="Papaya">Papaya</option>
<option value="Kiwi">Kiwi</option>
</select>

2番目の方法:イベントリスナーが関与しますが、同じことを行います(Javascript)(選択タグのIDがselector

function change(){
    alert(this.value)
}
document.getElementByID("selector").addEventListener("onchange",change)