On Apr 29, 6:56 am, René <renefourn...@gmail.com> wrote:
> Assuming:
>
> <select id="selector">
> <option value="0" selected="selected">Both</option>
> <option value="1">Red</option>
> <option value="2">Blue</option>
> <option value="3">Green</option>
> </select>
>
> <a id="prev">Prev</a>
> <a id="next">Next</a>
>
> Just wondering if someone has figured a simple jQuery function for
> moving through the a select list (using the above type of controls).
> The idea is that the Prev anchor would disappear if the first option
> is selected, and that the Next ancor would disappear if/when the last
> option is selected.
Why hide the controls? If the last option is selected and the user
clicks Next, make the first selected and vice versa:
<script type="text/javascript">
function prevNextOption(e) {
var b = e? e.target : window.event.srcElement,
sel = document.getElementById('sel0'),
len = sel.length,
n = (b.value == 'Next')? len + 1 : len - 1;
sel.selectedIndex = (sel.selectedIndex + n) % len;
}
window.onload = function() {
document.getElementById('inp0').onclick = prevNextOption;
document.getElementById('inp1').onclick = prevNextOption;
}
</script>
<select id="sel0">
<option selected>one
<option>two
<option>three
</select>
<input type="button" value="Previous" id="inp0">
<input type="button" value="Next" id="inp1">
--
Rob
