layui select动态添加删除option
时间: 2023-06-22 10:43:09 浏览: 194
动态添加 option 可以使用 jQuery 或者原生 JavaScript 实现,以下是一个使用 jQuery 的示例:
```javascript
// 添加一个 option
$('#selectId').append('<option value="value">text</option>');
// 删除最后一个 option
$('#selectId option:last').remove();
```
其中,`#selectId` 是 select 元素的 ID,`value` 和 `text` 分别是 option 的值和显示文本。
如果你想删除指定的 option,则可以使用以下代码:
```javascript
// 删除指定 value 的 option
$('#selectId option[value="value"]').remove();
```
同样地,如果想删除指定的索引位置的 option,可以使用以下代码:
```javascript
// 删除指定索引位置的 option
$('#selectId option:eq(index)').remove();
```
以上是使用 jQuery 实现动态添加和删除 option 的方法,如果你想使用原生 JavaScript 实现,可以使用以下代码:
```javascript
// 添加一个 option
var option = document.createElement('option');
option.value = 'value';
option.text = 'text';
document.getElementById('selectId').appendChild(option);
// 删除最后一个 option
var select = document.getElementById('selectId');
select.options[select.options.length - 1] = null;
```
同样地,如果想删除指定的 option,可以使用以下代码:
```javascript
// 删除指定 value 的 option
var select = document.getElementById('selectId');
for (var i = 0; i < select.options.length; i++) {
if (select.options[i].value === 'value') {
select.remove(i);
break;
}
}
// 删除指定索引位置的 option
var select = document.getElementById('selectId');
select.remove(index);
```
阅读全文