提交点击后的下拉菜单 [英] Submit drop down on click

问题描述

我在下拉列表中有一个由Wordpress生成的页面列表，单击后如何提交表单并转到所选页面?

I have a list of pages generated by Wordpress within a drop down, on click, how can submit the form and goto the page that was selected?

<form id="work" action="" method="post">
<select name="work">
    <?php $pages = get_pages(array('child_of' => '15', 'sort_column' => 'menu_order')); 
    foreach($pages as $post) {
    setup_postdata($post);
    $fields = get_fields(); ?>
        <option class="work-dropdown" value="<?php echo the_permalink(); ?>"><?php echo the_title(); ?></option>    
    <?php } wp_reset_query(); ?> 
</select>           
</form>

我尝试了这个jquery，但是我不确定这是否正确以及该采取什么行动:

I tried this jquery but I'm not sure if that's correct and what to put in the action:

<script type="text/javascript">
jQuery(document).ready(function( $ ) {
$('.work-dropdown').change(function() {
  $('#work').submit();
});
});
</script>

推荐答案

如果您只想重定向页面，请尝试:

If you simply want to redirect the page try:

<script type="text/javascript">
jQuery(document).ready(function( $ ) {
   $('select[name="work"]').change(function(){
        window.location = $(this).val();
    })
});
</script>

您可能希望向选择项添加ID，以使jQuery选择器更快. 因此，您将添加:id="page-redirect"到选择中，将jQuery对象更改为$('#page-redirect'). ID的选择比类或属性的选择要快得多.

You may want to add an ID to the select to make the jQuery selector faster. So you would add: id="page-redirect" to the select change the jQuery object to $('#page-redirect'). ID's are selected much faster than classes or attributes.

如果您希望表单发布到选定的URL，请尝试:

If you want the form to post to the selected URL then try:

<script type="text/javascript">
jQuery(document).ready(function( $ ) {
    $('#work select[name="work"]').change(function(){
        $('#work').attr('action', $(this).val()).submit();
    });
});
</script>

这篇关于提交点击后的下拉菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！