我有一個輸入框和一個 select2 多選元素。
選擇新選項后,我希望使用豎線字符合并所選選項的文本并填寫輸入框。
需要做的一件事是,我的選項可能有尾隨 - ,我需要在合并其文本之前對其進行修剪。基本上這很有效,直到我使用 .each() 來獲取每個選定選項的文本......有人可以為我解決這個問題嗎?TIA。
(function($) {
$(document).ready(function() {
$('#elems').select2();
});
$('#elems').on('change', function() {
var myvalue = $(this).find('option:selected').each(function(this) {
return $(this).text().replace(/^[-] /, '') '|';
});
$('#total').val(myvalue);
//alert($(this).find('option:selected').text().replace(/^[-] /, ''));
})
})(jQuery);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet"/>
<div>
<input type="text" id="total">
</div>
<div>
<select id="elems" name="elems[]" multiple>
<option value="one">-One</option>
<option value="two">--Two</option>
<option value="three">---Three</option>
<option value="four">----Four</option>
<option value="five">-----Five</option>
<option value="six">------Six</option>
<option value="seven">-------Seven</option>
<option value="eight">--------Eight</option>
</select>
</div>
uj5u.com熱心網友回復:
each當您嘗試text()從每個選定元素轉換或檢索時,您的主要問題是使用。
在這種情況下,map()就是您要查找的內容。這實質上是為每個元素呼叫您的函式(我知道這很混亂)并將結果組合到一個新陣列中。
(function($) {
$(document).ready(function() {
$('#elems').select2();
});
$('#elems').on('change', function() {
//notice map instead of each
var myvalue = $(this).find('option:selected').map(function(i, opt) {
return $(opt).text().replace(/^[-] /, '');
})
.get() //get the actual strings
.join("|"); //join the strings with a pipe
$('#total').val(myvalue);
})
})(jQuery);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet"/>
<div>
<input type="text" id="total">
</div>
<div>
<select id="elems" name="elems[]" multiple>
<option value="one">-One</option>
<option value="two">--Two</option>
<option value="three">---Three</option>
<option value="four">----Four</option>
<option value="five">-----Five</option>
<option value="six">------Six</option>
<option value="seven">-------Seven</option>
<option value="eight">--------Eight</option>
</select>
</div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/535437.html
