按 jQuery 对选项值进行分组
Grouping option value by jQuery
如何分组 option value
。
这是我的 HTML
<select id="kota"> </select>
和我的 JS
var $sel = $('select#kota');
availableTags.forEach(function(tag) {
$sel.append('<optgroup label="'+tag.area+'"><option value="'+tag.stationcode +'">'+ tag.label +'</option></optgroup>');
});
我想 'label' 分开雅加达和万隆。有什么 body 帮助吗?或建议?
这是我在 jsfiddle 中的完整代码。 https://jsfiddle.net/dedi_wibisono17/u1be7gkq/7/
我想要这样的期望
谢谢
这个解决方案怎么样。希望对您有所帮助:)!
$(document).ready(function(){
var availableTags = [{
label: "Bandung - Bandung (BD)",
area: "Bandung",
station: "Bandung",
stationcode: "BD"
}, {
label: "Bandung - Cicalengka (CCL)",
area: "Bandung",
station: "Cicalengka",
stationcode: "CCL"
}, {
label: "Bandung - Cikadongdong (CD)",
area: "Bandung",
station: "Cikadongdong",
stationcode: "CD"
}, {
label: "Jakarta - Gambir (GMR)",
area: "Jakarta",
station: "Gambir",
stationcode: "GMR"
}, {
label: "Jakarta - Jakarta Kota (JAKK)",
area: "Jakarta",
station: "Jakarta Kota",
stationcode: "JAKK"
}, {
label: "Jakarta - Jatinegara (JNG)",
area: "Jakarta",
station: "Jatinegara",
stationcode: "JNG"
}];
var bandungArray = [];
var jakartaArray = [];
var output1 = [];
var output2 = [];
for(var i = 0 ; i < availableTags.length; i++){
if((availableTags[i].label).indexOf("Bandung") !== -1){
bandungArray.push(availableTags[i]);
}
else{
jakartaArray.push(availableTags[i]);
}
}
bandungArray.forEach(function(tag) {
output1.push('<option value="'+ tag.stationcode +'">'+ tag.label +'</option>');
});
jakartaArray.forEach(function(tag) {
output2.push('<option value="'+ tag.stationcode +'">'+ tag.label +'</option>');
});
$('#kota').html("<optgroup label='Bandung'>"+output1.join('') + "<optgroup label='Jakarta'>"+output2.join(''));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select id="kota">
</select>
如何分组 option value
。
这是我的 HTML
<select id="kota"> </select>
和我的 JS
var $sel = $('select#kota');
availableTags.forEach(function(tag) {
$sel.append('<optgroup label="'+tag.area+'"><option value="'+tag.stationcode +'">'+ tag.label +'</option></optgroup>');
});
我想 'label' 分开雅加达和万隆。有什么 body 帮助吗?或建议? 这是我在 jsfiddle 中的完整代码。 https://jsfiddle.net/dedi_wibisono17/u1be7gkq/7/
我想要这样的期望
谢谢
这个解决方案怎么样。希望对您有所帮助:)!
$(document).ready(function(){
var availableTags = [{
label: "Bandung - Bandung (BD)",
area: "Bandung",
station: "Bandung",
stationcode: "BD"
}, {
label: "Bandung - Cicalengka (CCL)",
area: "Bandung",
station: "Cicalengka",
stationcode: "CCL"
}, {
label: "Bandung - Cikadongdong (CD)",
area: "Bandung",
station: "Cikadongdong",
stationcode: "CD"
}, {
label: "Jakarta - Gambir (GMR)",
area: "Jakarta",
station: "Gambir",
stationcode: "GMR"
}, {
label: "Jakarta - Jakarta Kota (JAKK)",
area: "Jakarta",
station: "Jakarta Kota",
stationcode: "JAKK"
}, {
label: "Jakarta - Jatinegara (JNG)",
area: "Jakarta",
station: "Jatinegara",
stationcode: "JNG"
}];
var bandungArray = [];
var jakartaArray = [];
var output1 = [];
var output2 = [];
for(var i = 0 ; i < availableTags.length; i++){
if((availableTags[i].label).indexOf("Bandung") !== -1){
bandungArray.push(availableTags[i]);
}
else{
jakartaArray.push(availableTags[i]);
}
}
bandungArray.forEach(function(tag) {
output1.push('<option value="'+ tag.stationcode +'">'+ tag.label +'</option>');
});
jakartaArray.forEach(function(tag) {
output2.push('<option value="'+ tag.stationcode +'">'+ tag.label +'</option>');
});
$('#kota').html("<optgroup label='Bandung'>"+output1.join('') + "<optgroup label='Jakarta'>"+output2.join(''));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select id="kota">
</select>