在这种情况下如何删除相关的文本字段输入

时间:2014-11-05 15:46:18

标签: jquery

我有5个文本字段,其值取决于它的preecedor(彼此)。

T1,T2,T3,T4,T5

我的要求是,如果其中一个Textfield为空,那么我必须将其所有成功者都清空。

如果T2为空,则使T3,T4,T5为空

同样

如果T3为空,则使T4,T5为空

如果T4为空,则使T5为空

<div data-role="fieldcontain">

<label for="name">T1 Category:</label>
    <input type="text" name="name" id="t1cat" value=""  onkeypress="return nospecialCharacters(event)"   placeholder="T1" autocomplete="off" /></br>

<label for="name">T2 Category:</label>
<input type="text" name="name" id="t2cat" value=""  onkeypress="return nospecialCharactersforT2(event)"   placeholder="T2" autocomplete="off" /></br>

<label for="name">T3 Category:</label>
<input type="text" name="name" id="t3cat" value="" onkeypress="return nospecialCharactersforT3(event)"   placeholder="T3"  autocomplete="off" /></br>

<label for="name">T4 Category:</label>
<input type="text" name="name" id="t4cat" value="" onkeypress="return nospecialCharactersforT4(event)"   placeholder="T4" autocomplete="off"  /></br>

<label for="name">T5 Category:</label>
<input type="text" name="name" id="t5cat" value="" onkeypress="return nospecialCharactersforT5(event)"   placeholder="T5" autocomplete="off" /></br>

    <input type="button" class= "btn blue" value="Request For This Category" id="requestcatbtn"/>

</div>  

function nospecialCharacters(e) {

      if (e.which == 38 || e.which==64)
            return false;

}


function nospecialCharactersforT2(e) {

    var T1 = $('#t1cat').val();

      if (e.which == 38 || e.which==64 || T1=='')
            return false;

}

function nospecialCharactersforT3(e) {

    var T2 = $('#t2cat').val();

      if (e.which == 38 || e.which==64 || T2=='')
            return false;

}

function nospecialCharactersforT4(e) {

    var T3 = $('#t3cat').val();

      if (e.which == 38 || e.which==64 || T3=='')
            return false;

}

function nospecialCharactersforT5(e) {

    var T4 = $('#t4cat').val();

      if (e.which == 38 || e.which==64 || T4=='')
            return false;

}

http://jsfiddle.net/5odssxkq/2/

2 个答案:

答案 0 :(得分:1)

您可以尝试使用.nextAll()方法。

$('input').change(function(){
    if( $(this).val() == '' ){
        $(this).nextAll('input[type="text"]').val('');
    }
});

http://jsfiddle.net/5odssxkq/3/

http://api.jquery.com/change/

希望这有帮助!

答案 1 :(得分:1)

<div id="divCategory" data-role="fieldcontain">
    <label for="name">T1 Category:</label>
    <input data-category="0" type="text" name="name" id="t1cat" value="A" onkeypress="return nospecialCharacters(event, this)" placeholder="T1" autocomplete="off" />
    <br />

    <label for="name">T2 Category:</label>
    <input data-category="1" type="text" name="name" id="t2cat" value="" onkeypress="return nospecialCharacters(event, this)" placeholder="T2" autocomplete="off" />
    <br />

    <label for="name">T3 Category:</label>
    <input data-category="2" type="text" name="name" id="t3cat" value="C" onkeypress="return nospecialCharacters(event, this)" placeholder="T3" autocomplete="off" />
    <br />

    <label for="name">T4 Category:</label>
    <input data-category="3" type="text" name="name" id="t4cat" value="D" onkeypress="return nospecialCharacters(event, this)" placeholder="T4" autocomplete="off" />
    <br />

    <label for="name">T5 Category:</label>
    <input data-category="4" type="text" name="name" id="t5cat" value="e" onkeypress="return nospecialCharacters(event, this)" placeholder="T5" autocomplete="off" />
    <br />

    <input type="button" class="btn blue" value="Request For This Category" id="requestcatbtn" />
</div>



<script src="../Scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
    var $categoryCount = 0;
    var $divCategoryObj;
    $(document).ready(function () {
        $divCategoryObj = $('#divCategory');
        $categoryCount = $divCategoryObj.find('[data-category]').length;

        recheckSubCategory();

        $divCategoryObj.on('keyup', '[data-category]', function (e) {
            recheckSubCategory();
        });
    });

    //function recheckSubCategory() {
    //    for (var i = 0; i < $categoryCount; i++) {
    //        var $obj = $divCategoryObj.find('[data-category="' + i + '"]');
    //        if ($obj.val().length == 0) {
    //            $obj.nextAll('[data-category]').val('');
    //            break;
    //        }
    //    }
    //};

    //Or

    function recheckSubCategory() {
        for (var i = 0; i < $categoryCount; i++) {
            var $obj = $divCategoryObj.find('[data-category="' + i + '"]');
            if ($obj.val().length == 0) {
                while (++i < $categoryCount) {
                    $obj.nextAll('[data-category="' + i + '"]').val('');
                }
            }
        }
    };

    function nospecialCharacters(e) {
        if (e.which == 38 || e.which == 64)
        { return false; }
    };

    //function nospecialCharactersforEmptyVal(e, obj) {
    //    var objVal = $(obj).val();
    //    if (e.which == 38 || e.which == 64 || objVal == '')
    //    { return false; }
    //};
</script>