Question

我有一个带有5个文本框的表单，我想显示下一个文本框，除非前一个不是空的。

类似的东西：

<form>
<input id="input1" name="input1" type="text" value="some text">
<br />
<!-- show -->
<input id="input2" name="input2" type="text" value=""> 
<br />
<!-- hide -->
<input id="input3" name="input3" type="text" value="">
<br />
<!-- hide -->
<input id="input4" name="input4" type="text" value="">
<br />
<!-- hide -->
<input id="input5" name="input5" type="text" value="">
</form>

Answer 1

可能这可以解决您的问题

＆＃13;

$(document).ready(function() {
    $('#input3,#input4,#input5').hide();
    $('#input1,#input2,#input3,#input4,#input5').keyup(function(e) {
        var el = $(this);
        var code = e.keyCode || e.which;
        if (code == '9') {
            // Ignore Tab key
            return;
        }
        if (el.val() != '') {
            el.next().next().show();
        } else {

            if (el.attr('id') != 'input1') { // do not hide input 1            
                el.hide();
            }
            el.next().next().hide();
        }
    });

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<form>
    <input id="input1" name="input1" type="text" value="some text">
    <br />
    <!-- show -->
    <input id="input2" name="input2" type="text" value="">
    <br />
    <!-- hide -->
    <input id="input3" name="input3" type="text" value="">
    <br />
    <!-- hide -->
    <input id="input4" name="input4" type="text" value="">
    <br />
    <!-- hide -->
    <input id="input5" name="input5" type="text" value="">
</form>

＆＃13;

如果previous不为空，则显示文本框

1 个答案: