验证表单而无需重新加载

Question

大家好，我是法国初学者，所以我为我的学校英语道歉:)

我有一个带有两种选择的表格，一种用于我的建筑物类型，另一种用于城市。 我需要在不重新加载页面的情况下验证此表单，并直接在表单下显示所选值的结果。

我在Wordpress上工作。

Archive.php：

<form  id="filtreform">
    <select class="menufiltre" name="type">
        ?php
        while ($row = $resultat->fetch_assoc())
        {
            echo "<option class='filtre' value='".$row['meta_value']."'>".$row['meta_value']."</option>";
        }
        ?>
    </select>

    <select class="menufiltre" name="city">
        <?php
        while ($row = $resultat2->fetch_assoc())
        {
            echo "<option class='filtre' value='".$row['meta_value']."'>".$row['meta_value']."</option>";
        }
        ?>
    </select>

    <button class="menufiltrebutton">Valider</button>
    <span class='filtre'><a href='../biens-immobiliers'>Tous</a></span>
</form>

在我的functions.php文件中，添加了两个jquery脚本和一个用于ajax脚本的脚本。 functions.php

add_action( 'wp_enqueue_scripts', 'jquery' );
function jquery(){
    wp_enqueue_script('jquery.validate.min', ("/wp-content/themes/restinn/js/jquery.validate.min.js"));
    wp_enqueue_script('jquery', ("/wp-content/themes/restinn/js/jquery.min.js"));
}

add_action( 'wp_enqueue_scripts', 'ajax' );
function ajax(){
    wp_enqueue_script('ajax', ("/wp-content/themes/restinn/js/ajax.js"));
}

在我的ajax.js文件中，我添加了一些代码来测试我的表单是否有效。 而且它不起作用我不知道为什么：/

jQuery(document).ready(function() {
    jQuery('.menufiltrebutton').click(function() {
        alert('YOLO1');
        jQuery('.menufiltre').change();
        $(this).css("background-color", "#D6D6FF");
    a    lert('YOLO2');
});

我使用此文档来帮助我： http : //www.w3schools.com/jquery/tryit.asp? filename =tryjquery_event_change_trigger

谢谢你的帮助 ：）

Answer 1

.on（'submit'）将触发下一个函数触发。