Question

我要求用户输入他们的体重，但需要考虑公制和英制。

我认为最简单/最友好的方式是询问他们如何通过下拉菜单输入体重/身高，然后显示他们填写的字段。

我使用jQuery尝试了这个但是失败了，我也认为我错过了一些非常重要的东西，因为最后的final需要传递给dblet for db entry。

我正在使用下面的代码来展示选项，然后尝试各种各样的失败，欢迎任何帮助或建议，谢谢！

    <label for "metricImperial">Metric or Imperial measurements?</label>
    <select id="metricImperial" name="metricImperial" class="required">
    <option value=""> -Select- </option>
        <option value="metric">Metric (kg) : Ex: 80kg</option>
        <option value="imperial">Imperial (lbs only) Ex: 190lbs<option>
        <option value="imperialSt">Imperial (St & lbs) Ex: 12st 8lbs<option>
    </select>

如果用户选择了st和lbs选项，我需要提供两个字段，并将这些值传递给servlet，而不是只传递给它一个。

  <div id="metric"style="display:none;">
    <label for "weight">Weight</label>
    <input id="weight" type="text" name="weight" type="text"  class= minlength="1"  placeholder="weight in kg only" /> <BR>
    </div>

    <div id="imperial"style="display:none;">
    <label for "weight">Weight</label>
    <input id="weight" type="text" name="weight" type="text"  class= minlength="1"  placeholder="weight in lbs only"/> <BR>
    </div>

    <div id="imperialSt"style="display:none;">
    <label for "weight">Weight</label>
    <input id="weight" type="text" name="weight" type="text"  class= minlength="1"  placeholder="st"/> <BR>
    <input id="weight2" type="text" name="weight2" type="text"  class= minlength="1"  placeholder="lb"/> <BR>
    </div>


$(document).ready(function(){ 

jQuery(function($){
    $('#updateUserDetails').validate();

    $('#metric').hide(); //hide field
    $('#imperial').hide(); //hide field
    $('#imperialSt').hide(); //hide field 

    $("#metricImperial").change(function(){
        var metOrImp = $(this).val();//get the value from the dropdown
        alert(metOrImp);
        //switch, may not be the best but...
        switch(metOrImp){

        case 'metric' :
            ("#metric").show();
            ("#imperial").hide();
            ("#imperialSt").hide();
            break;
        case 'imperial' :
            ("#imperial").show();
            ("#metric").hide();
            ("#imperialSt").hide();
            break;
        case 'imperialSt' :
            ("#imperialSt").show();
            ("#metric").hide();
            ("#imperial").hide();
            break;
        }

    });


}
);


});

感谢您的帮助

Answer 1

你的Jquery是错的。你错过了全部的$符号，jQuery(function($){也是不必要的..请参阅下面的代码 - ＆gt; 。

$(document).ready(function(){

    $('#metric').hide(); //hide field
    $('#imperial').hide(); //hide field
    $('#imperialSt').hide(); //hide field 

    $("#metricImperial").change(function(){
        var metOrImp = $(this).val();//get the value from the dropdown
        alert(metOrImp);
        //switch, may not be the best but...
        switch(metOrImp){

        case 'metric' :
            $("#metric").show();
            $("#imperial").hide();
            $("#imperialSt").hide();
            break;
        case 'imperial' :
            $("#imperial").show();
            $("#metric").hide();
            $("#imperialSt").hide();
            break;
        case 'imperialSt' :
            $("#imperialSt").show();
            $("#metric").hide();
            $("#imperial").hide();
            break;
        }

    });

});

改变公制和英制形式（重量/高度）的方法

1 个答案: