本地存储中的值可以用来验证年龄吗?

Can the values in local storage be used to verify age?

我正在寻求验证码方面的帮助。我正在寻找一种简单的方法来验证两个年龄。有一个 "from age" 和一个 "to age"。我需要确保用户正确选择了年龄。 "from age" 应该比 "to_age. I made a script and it kind of works. The problem is it does not work consistently. I need it to check, when you select the "from_age" 下拉菜单和 "to_age" 下拉菜单更年轻。这个似乎只适用于其中一个下拉菜单并且一次通过。它在页面加载时不起作用,有时根本不起作用。我尝试了两个选项,但都没有用。我尝试使用 localstorage 值,因为另一个脚本我已经很好地加载了键和值的变化。或者我需要尝试修复这个使用选项下拉列表中的值的版本。​​我不确定哪个会更好,但我认为 localstorage 值是更好的选择。

我曾尝试使用与本地存储中的键关联的值,但未能使其正常工作。使用 select/options 中的值的方法有效但效果不佳。如果我在浓缩这个问题的代码时犯了任何错误,请原谅。谢谢

jQuery

$(function() {
    $('.agefrom_selection').change(function () {
        var quantity_1 =  parseInt($('.agefrom_selection').val());
        var quantity_2 = parseInt($('.ageto_selection').val());

        if ( quantity_1 > quantity_2 ) {
            $('.age_warning').addClass('show_age_warning')
        }
        else {
            $('.age_warning').removeClass('show_age_warning')
        }
    });
}); 

CSS

.age_warning {
    display: none; 
}
.age_warning.show_age_warning {
    display: block;
    position: relative;
    float: right;
    font-size: 12px;
    color: #ff0000;
}

html

<form id="ageselection" method="post" autocomplete="off">                                                
<fieldset>
<ul class="age_preference_text_box fl">                                                     
<li><label class="from_to_age_text">from </label>                                                            
<select class="age_text agefrom_selection">                                                                
<option value="18" selected>18</option>                                                                
<option value="19">19</option>                                                                
<option value="20">20</option>                                                                
<option value="21">21</option>                                                                
<option value="22">22</option>
</select>
</li>


<li><label class="from_to_age_text">from </label>
<p class="age_warning"> "to" age must be equal <br>or higher than "from" age</p>                                                            
<select class="age_text ageto_selection">                                                                
<option value="18" selected>18</option>                                                                
<option value="19">19</option>                                                                
<option value="20">20</option>                                                                
<option value="21">21</option>                                                                
<option value="22">22</option>
</select>
</li>
</ul>
</fieldset>
</form>

我预计警告会在每个实例上显示(或消失)。如果您更改 from_age 下拉菜单,当您更改 to_age 下拉菜单时,当您修改任一下拉菜单时,如果您刷新页面,以及如果您在页面刷新后操作任何下拉菜单。我的代码写得不好,没有按预期工作。

我明白了。该功能仅写在其中一个下拉选择器上。它需要为两个下拉选择器编写。答案将类似于:

$(function() {
    $('.agefrom_selection').change(function () {
        var quantity_1 =  parseInt($('.agefrom_selection').val());
        var quantity_2 = parseInt($('.ageto_selection').val());

        if ( quantity_1 > quantity_2 ) {
            $('.age_warning').addClass('show_age_warning')
        }
        else {
            $('.age_warning').removeClass('show_age_warning')
        }
    });
    $('.ageto_selection').change(function () {
        var quantity_1 =  parseInt($('.agefrom_selection').val());
        var quantity_2 = parseInt($('.ageto_selection').val());

        if ( quantity_1 > quantity_2 ) {
            $('.age_warning').addClass('show_age_warning')
        }
        else {
            $('.age_warning').removeClass('show_age_warning')
        }
    });

如果有人能想出更好的办法,我很愿意听。谢谢