使用另一个按钮的下一个选项下拉框

Question

我有一个下拉菜单，其中包含我想要的信息，但我想添加一个按钮 单击时跳转到该下拉菜单中的下一个选项.. 我该怎么做？

这是我的下拉框：

<select name="the_name">
     <?php foreach ( $results as $option ) : ?>
     <option value="<?php echo $option->ID; ?>"><?php echo $option->titel; ?></option>
     <?php endforeach; ?>
</select>

所以，我喜欢做的是单击此菜单的按钮，例如上一个/下一个，我该怎么做？

谢谢！

Answer 1

试试这个：

在你的 DOM 中：

<select id="the_name">
    <option selected="selected">1</option>
    <option>2</option>
</select>

<button id="next">next</button>

在你的 jquery 中，按钮事件

$('#next').click(function(){
     $('#the_name').find('option:selected').prop('selected',"").next().prop('selected','selected');

});

Answer 2

试试

fiddle Demo

var dd = $('#the_name');
var max_len = dd.find('option').length;
$('#change').click(function () {
    var x = dd.find('option:selected').index();
    if (max_len == x + 1) x = -1;
    dd.find('option').eq(x + 1).prop('selected', true);
});

---

.index()

.prop()

.find()

.eq()