首页 > 解决方案 > 删除输入值时动态添加的标签文本

问题描述

如果输入的值为空,我已将所有标签文本附加到 div#test,并且希望在用户在文本框/下拉列表中输入/选择值时将其删除。

<div id="test">
</div>
$('input, select').each(function(){
    var $element = $(this)

    if ($element.val() == '') {
        var $label = $("label[for='"+this.id+"']");
        $("#test").append($label.text());
    }

}); 

注意:由于表格很大,只添加了相关代码。

标签: jqueryhtml

解决方案


我不确定这是你想要的。如果我理解您的问题,您想从#test div 中删除输入字段中具有值的标签。

HTML 代码:

<label for="input_1">Label</label><br />
<input type="text" name="input_1"/><br />
<label for="input_2">Label2</label><br />
<input type="text" name="input_2" />

Javascript代码:

function addEmptyToDiv() {
    $('input, select').each(function(){
        var $element = $(this)

        if ($element.val() == '') {
          var $label = $("label[for='"+this.name+"']");
          $("#test").append($label.text());
        }
    }); 
}
addEmptyToDiv();


$('input, select').on("change paste keyup blur", function() {
    // Remove everything from the #test div
    $("#test").empty();
    addEmptyToDiv();

});

工作小提琴: https ://jsfiddle.net/6csyoL24/


推荐阅读