select2マルチセレクトコントロールの区切り記号をセミコロンに変更するにはどうすればいいですか？

Question

私はMultiSelectコントロールでSelect2 jQueryライブラリを使用しようとしています。コントロールは正常に動作しますが、select2が複数選択コントロールに使用する値のデフォルトの区切り記号（セパレータ）を変更する必要があります。

現在、マルチセレクションコントロールの値から値を取得する出力はcommaです。代わりに、値をsemi-colonにする必要があります。どのようにすることができますか？

$("#btn").click(function(e) { 
 
    e.preventDefault(); 
 

 
    $("#result").text('Output: ' + $("#example1").select2("val")); 
 
}); 
 

 
$("#example1").select2({ 
 
    seperator: ";" 
 
});

#btn { 
 
    margin: 20px 0px; 
 
} 
 
#result { 
 
    margin: 20px 0px; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.4/select2.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.4/select2.js"></script> 
 

 
<select id="example1" placeholder="Select ..." class="" style="width:100%;" multiple="multiple"> 
 
    <option value="Option 1">Option 1</option> 
 
    <option value="Option 2">Option 2</option> 
 
    <option value="Option 3">Option 3</option> 
 
    <option value="Option 4">Option 4</option> 
 
    <option value="Option 5">Option 5</option> 
 
    <option value="Option 6">Option 6</option> 
 
</select> 
 
<input type="button" id="btn" value="Click Me" /> 
 
<div id="result">Output: 
 
</div>

Answer 1

あなたのオプション値にカンマが含まれていてもよい述べたので、私のオリジナル回答は動作しません。 （私はデモの目的のためにあなたのオプション値にカンマを追加しました）の代わりにこれを試してみてください：

$("#result").text('Output: ' + $("#example1").select2("val").join(';')); 

$("#btn").click(function(e) { 
 
    e.preventDefault(); 
 
    $("#result").text('Output: ' + $("#example1").select2("val").join(';')); 
 
}); 
 

 
$("#example1").select2();

#btn { 
 
    margin: 20px 0px; 
 
} 
 
#result { 
 
    margin: 20px 0px; 
 
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.4/select2.css" rel="stylesheet" /> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.4/select2.js"></script> 
 

 
<select id="example1" placeholder="Select ..." class="" style="width:100%;" multiple="multiple"> 
 
    <option value="Option, 1">Option 1</option> 
 
    <option value="Option, 2">Option 2</option> 
 
    <option value="Option, 3">Option 3</option> 
 
    <option value="Option, 4">Option 4</option> 
 
    <option value="Option, 5">Option 5</option> 
 
    <option value="Option, 6">Option 6</option> 
 
</select> 
 
<input type="button" id="btn" value="Click Me" /> 
 
<div id="result">Output: 
 
</div>