<select> menu navigation with WordPress

I am trying to convert the ‘list pages’ function in WordPress into a dynamic select menu navigation (like the first example here: http://lab.artlung.com/dropdown/). I have tried converting wp_list_pages using js with this code:

$(function() {
$('ul.selectdropdown').each(function() {
    var $select = $('<select />');

    $(this).find('a').each(function() {
        var $option = $('<option />');
        $option.attr('value', $(this).attr('href')).html($(this).html());
        $select.append($option);
    });

    $(this).replaceWith($select);
});

});

Read More

This works converting it, but doesn’t allow me to insert the required:

onchange="window.open(this.options[this.selectedIndex].value,'_top')"

Am I able to drop this into the above function, or is there a better way of going about this?

Any help would be great.

<– edit –> the below function works correctly:

$("ul.selectdropdown").show();

$(function() {
$(‘ul.selectdropdown’).each(function() {
var $select = $(”);

    $(this).find('a').each(function() {
        var $option = $('<option />');
        $option.attr('value', $(this).attr('href')).html($(this).html());
        $select.append($option); 
        $select.change(function() { window.open($select.find(':selected').val(), '_top'); });
    });

    $(this).replaceWith($select);
});

});

Related posts

Leave a Reply

1 comment