Javascript 当用户从组合框中选择特定值时显示字段-验证逻辑问题

我有一个组合框，可以从中选择两个值。

男性

或

女性

。当用户选择男性时，会显示另外两个文本框。这两个文本框不能为空（因为它们正在被验证）

问题是：当用户选择

女性

时，上面讨论的两个文本框被隐藏，我不允许导航到下一个屏幕而不向这两个字段填充一些值（因为它正在验证）。我怎样才能解决这个问题

我的代码

<table>
    <tr>
        <td align="left">
            <select id="gender" name="gender" onchange='genderfind(this.value);'>
            <option value="female">female</option>
            <option value="male">Male</option>
            </select>
        </td>
        <td id="gb" style="display:none;"> <td>
            <input type="text" name="name" /></td>
<td align="left"><span id="msg_name"></span>&nbsp;</td>
 <td>
            <input type="text" name="lastname" /></td>
<td align="left"><span id="msg_lastname"></span>&nbsp;</td>
        </td>
    </tr>
</table>
</body>

女性的
男性

JQUERY

function validateStep() {

                var isValid = true;


                var un = $('#name').val();

                if (!un && un.length <= 0) {

                    isValid = false;

                    $('#msg_name').html('first name missing').show();

                } else {

                    $('#msg_name').html('').hide();

                }

                // validate password

                var l = $('#lastname').val();

                if (!l && l.length <= 0) {

                    isValid = false;

                    $('#msg_lastname').html('last name missing').show();

                } else {

                    $('#msg_lastname').html('').hide();

                }

                return isValid;

            }

函数validateStep（）{
var isValid=true；
var un=$（'#name'）.val（）；
if（！un&&un.length仅当两个字段可见时调用
validatesp（）
函数

 if($('#msg_name').is(":visible")){
    validateStep ();
 })

在
isValid=true之后；
在
return isValid；
之前将其余代码包装在
if
循环
if（document.getElementById（'gb'）.style.display==“block”）{/*[您的验证]*/
}

而且你的HTML代码是不正确的。你不能直接在另一个
td
里面放一个
td
。如果你把
span
或
div
或
p
或任何其他元素而不是
td
里面的
为什么不把验证放在一个条件下检查性别==男性？我应该在哪里添加此方法？将其添加到脚本中调用validateStep函数的位置
 if($('#msg_name').is(":visible")){
    validateStep ();
 })