0

コンボ ボックスがあり、そこから 2 つの値を選択できます。またはのいずれMaleかFemale。ユーザーが選択するMaleと、別の 2 つのテキストボックスが表示されます。これら 2 つのテキスト ボックスを空にすることはできません (検証中のため)。

問題: ユーザーが を選択するFemaleと、上記の 2 つのテキストボックスが非表示になり、これらの 2 つのフィールドに値を入力しないと次の画面に移動できません (検証中のため)。どうすればこれを解決できますか?

私のコード

<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>

Jクエリ

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;

            }

///

<script>
function genderfind(val) {
            //alert(element);
            if (val == 'male' ) {
                document.getElementById('gb').style.display = 'block';
            } else {
                document.getElementById('gb').style.display = 'none';
            }

        }
</script>
4

2 に答える 2

1

validateStep()2 つのフィールドが表示されている場合にのみ関数を呼び出します。

 if($('#msg_name').is(":visible")){
    validateStep ();
 })
于 2013-09-27T05:46:12.377 に答える
1

ループのisValid = true;直前に残りのコードをラップしreturn isValid;た後ifif(document.getElementById('gb').style.display == "block") { /*[ your validation]*/ }

また、HTML コードが正しくありません。tdaを anotherの中に直接持つことはできませんtd。内部の の代わりにspanまたはdivまたは またはpその他の要素を配置することをお勧めします。td<td id="gb" style="display:none;">

于 2013-09-27T06:11:03.337 に答える