删除jquery中的文本字段值

时间:2015-11-10 06:35:20

标签: javascript php jquery html css

当我点击添加它时,显示带有值的文本字段。当我点击删除它的隐藏。但是,当我点击删除时,我想删除文本字段值。

的CSS

#second {
    display: none;
}
#third {
    display: none;
}
#forth {
    display: none;
}
#fifth {
    display: none;
}

HTML

<div id="header">
     <a href="#" id="add1">add</a> - <a href="#" id="remove">remove</a>
    <div id="first" class="toggle"><input type="text" value="1" name="sid[]">first</div>            
    <div id="second" class="toggle"><input type="text" value="2" name="sid[]">second</div>
    <div id="third" class="toggle"><input type="text" value="3" name="sid[]">third</div>
    <div id="forth" class="toggle"><input type="text" value="4" name="sid[]">forth</div>
    <div id="fifth" class="toggle"><input type="text" value="5" name="sid[]">fifth</div>
</div>

Jquery的

$(document).ready(function() {
        $("#add1").click(function() {
            $('.toggle:not(:visible)').first().show();
        });
        $("#remove").click(function() {
            $('.toggle:visible').last().hide();

        });
    });

这是我的代码Jsfiddle

4 个答案:

答案 0 :(得分:2)

只需在.find('input').val('');之后添加.hide();即可

$('.toggle:visible').last().hide().find('input').val('');

DEMO

答案 1 :(得分:2)

试试这段代码: -

.count_box {
    position: relative;
    background: #FFF;
    border: 1px solid #333;
    display: inline-block;
    margin-left: 10px;
    border-radius: 3px;
    padding: 6px 10px;
    top: 1px;
    color: #333;
}

答案 2 :(得分:1)

嗨现在使用 .find() .val() 就像这样

$(document).ready(function() {
        $("#add1").click(function() {
            $('.toggle:not(:visible)').first().show();
        });
        $("#remove").click(function() {
            var valNon = $('.toggle:visible').last().hide();
               valNon.find('input').val(''); // add this line   

        });
    });

答案 3 :(得分:1)

使用此

$(document).ready(function() {
        $("#add1").click(function() {
            $('.toggle:not(:visible)').first().show();
        });
        $("#remove").click(function() {
           $('.toggle:visible').last().hide().find('input').val('');
        });
    });

Jsfiddel