Question

我想在这里做的是我有一个选择框和一个输入。

选择框有3个选项，值为1,2和3，输入为div，ID为INPUT。

我想要的是当我选择值为3的选项以删除id为INPUT的整个div标签时，然后当我再次单击1或2上的示例DIV标签再次追加时。但是当我点击1或2时，div标签会一次又一次地附加。

是否有机会检查div标签是否存在而不是附加。

这是我的jQuery：

$('select').change(function(){
            var val = $(this).val();
                if(val == '3'){
                    $('#INPUT').remove();
                    }

                if(val !== '3'){
                $('.valuta').before('<div id="INPUT"><input type="text"  class="price"></div>');

                    }
                });

任何帮助将不胜感激。感谢。

Answer 1

是的，这是可能的。改变这个：

if(val !== '3'){

到此：

if(val != '3' && $("#INPUT").size() == 0){

这样，我们会询问是否已经有id = INPUT的div，如果没有，则我们添加一个。

干杯

Answer 2

在添加新元素

之前，检查标识为INPUT的元素是否已存在

if (val != '3' && !$('#INPUT').length) {
    $('.valuta').before('<div id="INPUT"><input type="text"  class="price"></div>');
}

演示：Fiddle

此外，您可以微调if条件，因为如果值不是3，那么您希望拥有输入字段，因此不需要第二个if条件只需使用else块第一个条件

$('select').change(function () {
    var val = $(this).val();
    if (val == '3') {
        $('#INPUT').remove();
    } else if (!$('#INPUT').length) {
        $('.valuta').before('<div id="INPUT"><input type="text"  class="price"></div>');
    }
})

演示：Fiddle

jQuery停止重复追加

2 个答案: