Question

我想从目标中的表单更改属性操作以动态获取下一页。在javascript中，我的变量action获得了正确的值{＆＃39;但页面仍然没有加载。如果我手动返回正确的值＆＃39;它可以正常工作，但是当我使用jQuery('#select_program').children().filter(':selected').text().replace(/\s+/g, '-').toLowerCase(),动态创建它时它不起作用。

这是我的表格（在php中）：

public function form_creation() {
    $html = '<form id="search_projects" action="';
    $html .= esc_url(get_bloginfo('url'));
    $html .= '/" method="post">';
        $html .= '<select id="select_langue" name="lg123" onchange="change_select(0, this.value)">';
            $html .= '<option value="nd" class="optionDefault">';
                $html .= __('Language', 'mon-plugin'); 
                $html .= '</option>';
        $html .= '</select>';
        $html .= '<select id="select_program" name="pg123" onchange="change_select(1, this.value)">';
            $html .= '<option value="nd" class="optionDefault">';
                $html .= __('Program', 'mon-plugin');
            $html .= '</option>';
        $html .= '</select>';
        $html .= '<select id="select_country" name="dst123" onchange="change_select(2, this.value)">';
            $html .= '<option value="nd" class="optionDefault">';
                $html .= __('Country', 'mon-plugin');
            $html .= '</option>';
        $html .= '</select>';
        $html .= '<select id="select_city" name="city123" onchange="change_select(3, this.value)">';
            $html .= '<option value="nd" class="optionDefault">';
                $html .= __('City', 'mon-plugin');
            $html .= '</option>';
        $html .= '</select>';
        $html .= '<input type="hidden" name="data123" value="';
        $html .= htmlspecialchars(json_encode($this->backend_select_category));
        $html .= '"/>';
        $html .= '<button id="submit_project_list" type="submit">';
            $html .= '<i class="fa fa-search" aria-hidden="true"></i>';
            $html .= __('Search', 'mon-plugin');
        $html .= '</button>';
    $html .= '</form>';

    return $html;
}

这是我的javascript：

jQuery('#search_projects').submit(function() {
    var selection_value = [
        jQuery('#select_langue').val(),
        jQuery('#select_program').val(),
        jQuery('#select_country').val(),
        jQuery('#select_city').val()
    ];
    var selection_display = [
        jQuery('#select_langue').children().filter(':selected').text().replace(/\s+/g, '-').toLowerCase(),
        jQuery('#select_program').children().filter(':selected').text().replace(/\s+/g, '-').toLowerCase(),
        jQuery('#select_country').children().filter(':selected').text().replace(/\s+/g, '-').toLowerCase(),
        jQuery('#select_city').children().filter(':selected').text().replace(/\s+/g, '-').toLowerCase()
    ];
    jQuery(this).attr('action', function() {
        if (selection_value[1] !== 'nd') {
            var action = selection_display[1];
            if (selection_value[2] !== 'nd') {
                action += selection_display[2];
                if (selection_value[3] !== 'nd') {
                    action += selection_display[3];
                }
            }
        } else {
            var action = 'search_program';
        }
        return action;
    });
});

感谢您的帮助！

Answer 1

我解决了这个问题。

我意识到当我不更改任何选择时，页面会发生变化。但是，当我只更改一个选择时，页面不再加载。

我不知道为什么，但问题来自我在php中的隐藏输入。如果我删除它，一切正常。

很好..但是如何通过此表单将数据发送到另一页呢？

提前感谢您的帮助！

Javascript表单使用attr属性提交更改操作

1 个答案: