jQuery 检查一个 ul 是否包含另一个 ul 的元素
jQuery check if one ul contains elements from another
我有两个列表
我想要做的是从第一个列表中获取每个元素的文本,如果文本与第二个列表中的元素值相匹配,而不是在 select 选项第二个列表中对其进行着色。
这是两个列表:
榜单第 1
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>
榜单第 2
<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
<option value="1444">a</option>
<option value="1445">b</option>
<option value="1446">c</option>
<option value="1447">d</option>
<option value="1448">e</option>
<option value="1449">f</option>
<option value="1450">g</option>
</select>
</div>
这就是我到目前为止所做的....
$("#edit-field-building-no-value-wrapper option").each(function() {
var building = $(this).text();
console.log(building);
$("#rssedituserdata>li").each(function(building) {
if ($(this).has(building)) {
building.css('color', 'red');
}
});
});
使用属性 select 或 select 值属性等于列表项文本的选项:
$("#rssedituserdata>li").each(function(i,v) {
$('option[value="'+$(v).text()+'"]').css('color', 'red');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>
<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
<option value="1444">a</option>
<option value="1445">b</option>
<option value="1446">c</option>
<option value="1447">d</option>
<option value="1448">e</option>
<option value="1449">f</option>
<option value="1450">g</option>
</select>
</div>
要删除不在列表中的元素,请执行以下操作:将 class 添加到列表中的元素并删除所有没有 class 的选项
$("#rssedituserdata>li").each(function(i,v) {
$('option[value="'+$(v).text()+'"]').addClass('dont-remove').css('color', 'red');
});
$('option:not(.dont-remove)').remove();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>
<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
<option value="1444">a</option>
<option value="1445">b</option>
<option value="1446">c</option>
<option value="1447">d</option>
<option value="1448">e</option>
<option value="1449">f</option>
<option value="1450">g</option>
</select>
</div>
我有两个列表
我想要做的是从第一个列表中获取每个元素的文本,如果文本与第二个列表中的元素值相匹配,而不是在 select 选项第二个列表中对其进行着色。
这是两个列表:
榜单第 1
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>
榜单第 2
<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
<option value="1444">a</option>
<option value="1445">b</option>
<option value="1446">c</option>
<option value="1447">d</option>
<option value="1448">e</option>
<option value="1449">f</option>
<option value="1450">g</option>
</select>
</div>
这就是我到目前为止所做的....
$("#edit-field-building-no-value-wrapper option").each(function() {
var building = $(this).text();
console.log(building);
$("#rssedituserdata>li").each(function(building) {
if ($(this).has(building)) {
building.css('color', 'red');
}
});
});
使用属性 select 或 select 值属性等于列表项文本的选项:
$("#rssedituserdata>li").each(function(i,v) {
$('option[value="'+$(v).text()+'"]').css('color', 'red');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>
<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
<option value="1444">a</option>
<option value="1445">b</option>
<option value="1446">c</option>
<option value="1447">d</option>
<option value="1448">e</option>
<option value="1449">f</option>
<option value="1450">g</option>
</select>
</div>
要删除不在列表中的元素,请执行以下操作:将 class 添加到列表中的元素并删除所有没有 class 的选项
$("#rssedituserdata>li").each(function(i,v) {
$('option[value="'+$(v).text()+'"]').addClass('dont-remove').css('color', 'red');
});
$('option:not(.dont-remove)').remove();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>
<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
<option value="1444">a</option>
<option value="1445">b</option>
<option value="1446">c</option>
<option value="1447">d</option>
<option value="1448">e</option>
<option value="1449">f</option>
<option value="1450">g</option>
</select>
</div>