Html,插入选项列表分隔符

Html, inserting option list separators

本文关键字:列表 分隔符 选项 插入 Html      更新时间:2023-09-26

我想用jQuery为php生成的列表添加分隔符

<select>
    <option value="0">all</option>
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
    <option value="4">other</option>
</select>

如何在第一个元素之后和最后一个元素之前放置分隔符

<select>
    <option value="0">all</option>
    <option value="-1" disabled="disabled">------</option>
    <option value="1">option 1</option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
    <option value="-1" disabled="disabled">------</option>
    <option value="4">other</option>
</select>

?

谢谢

var $ops = $('select option'), //refine selector if needed
    $sep = $('<option>', { text: '------', disabled: true, value: -1 });
$ops.first().after($sep.clone()).end()
    .last().before($sep);

小提琴

参考:

  • 遍历-过滤
  • 操作- DOM插入,外部

我不知道这是不是你需要的,但是<optgroup>标签做了类似的事情

短代码:

$("option[value=0]").after('<option value="-1" disabled="disabled">------</option>');