Javascript 如果div中的所有输入和选择都为空，如何删除div

我有很多类似下面的div

<div class="plsCheck">
<input type="text"value=""/>
<input type="text"value="" />
<select>
 <option value="1" selected>1</option>
 <option value="2" selected>2</option>
 <option value="3" selected>3</option>
</select>
</div>

<div class="PlsCheck">...</div>
<div class="PlsCheck">...</div>

最后，我尝试了下面的代码是确定的。关键点是$this是变更，所以我需要定义一个var来存储$this；其次，检查div后，fillIn需要是init

var fillIn=false;
$('.item_type_group').each(function(){
    __this=$(this);
    $(this).find('select, input[type=text]').each(function(){if ($(this).val() !='') fillIn=true;});
    if(!fillIn) __this.remove();
    fillIn=false;
});      

---

如果div及其所有内容没有任何价值，您是否愿意将其从视图中删除？如果是这样，您需要一个函数，该函数将：

a。检查元件的状态；然后 B有条件地隐藏div

首先，您需要为元素提供ID，以便可以引用它们，并为选择列表提供选择选项，例如：

<div class="plsCheck">
  <input id="txt1" type="text" value="" />
  <input id="txt2" type="text" value="" />
  <select id="sel1">
    <option>--- Select ---</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
</div>

我还冒昧地对您的HTML进行了一些小的修改

接下来，您将需要您的函数。我将用javascript实现这一点，这样您就知道发生了什么。如果您希望：

function checkDiv() {
  var div = document.getElementById('plsCheck');
  var txt1 = document.getElementById('txt1');
  var txt2 = document.getElementByid('txt2');
  var sel1 = document.getElementById('sel1');
  if(txt1.value.length < 1 && txt2.value.length < 1 && sel1.selectedIndex < 1) {
    div.style.visibility = 'hidden';
  } else {
    div.style.visibility = 'visible';
  }
}

最后，您需要考虑如何触发函数。例如，每当用户更改其从选择列表中的选择或更改文本框中的文本时，都可以触发该选项，如下所示：

<input id="txt1" type="text" onchange="javascript:checkDiv();" />
<input id="txt2" type="text" onchange="javascript:checkDiv();" />
<select id="sel1" onchange="javascript:checkDiv();">

如果您这样做了，那么一旦用户做出了符合以下条件的更改：1两个文本框均为空，2从选择列表中没有选择，则div及其内容将从屏幕上消失

---

希望这能有所帮助。

因为您没有提供触发此行为的事件，所以我只提供可以实现您所需的代码。但是，您必须修改select元素；因为它总是有一个值：1、2或3。。。因此，不会删除任何div。此外，仅当“选择”具有多个属性时，才希望在多个选项上具有“选定属性”

$('.plsCheck').filter(function() {
    return $('input,select', this).filter(function() {
        return !!this.value;
    })
    .length == 0;
})
.remove();

使用按钮点击作为触发器的演示

$function{ $“检查”。单击“检查”功能{ $'.plsCheck'.filterfunction{ 返回$'input，select'，this.filterfunction{ return！！this.value； } .长度==0； } 去除 }; }; A. 选择 1. 2. 3. B 选择 1. 2. 3. C 选择 1. 2. 3. D 选择 1. 2. 3. 检查 试试这个：

$('.plsCheck').each(function(index, obj){
    var fillIn=false;
    $(obj).find('select input').each(function(idx, elem){if ($(elem).value !='') fillIn=true;});
    if(!fillIn) $(obj).remove();
}); 

---

基本上，使用$。每个回调的第二个参数来获取目标元素的句柄，

感谢您的贡献。 因为我认为我使用的解决方案有一点不同。我想在这里发布我的解决方案，或者你可以查看我的问题

var fillIn=false;
$('.plsCheck').each(function(){
    __this=$(this);
    $(this).find('select, input[type=text]').each(function(){if ($(this).val() !='') fillIn=true;});
    if(!fillIn) __this.remove();
    fillIn=false;
}); 

---

我想删除元素你想删除哪个元素？标题说你想隐藏div，但问题的主体说你想删除它。是哪一个？隐藏或删除？如果从一开始它是空的，那么人们应该如何选择它？这意味着它是隐藏的，并且“不可选择的”。如果在事件处理程序中，所有的输入和选择在页面加载时都没有值，我想删除元素？谢谢你的澄清，但你没有说什么时候，或者是什么时候，应删除该元素。你能花点时间来回答这个问题吗？清楚地解释一下，你的代码哪里做错了，它应该做什么，它应该做什么，不应该做什么？作为指导，请阅读指南，因为你的问题目前非常模糊和不清楚，这意味着我们无法帮助你，除非通过猜测。我最喜欢这个解决方案。谢谢。@KennethChan Selector select input选择的输入元素是select的后代，而不是select和input元素。value是DOM元素的属性，而不是$elem处的jQuery对象。value是的，应该选择代码，而是输入[type=text]。

var fillIn=false;
$('.plsCheck').each(function(){
    __this=$(this);
    $(this).find('select, input[type=text]').each(function(){if ($(this).val() !='') fillIn=true;});
    if(!fillIn) __this.remove();
    fillIn=false;
});