如何使用jQuery移除空白输入框？列表项中空白输入框移除失败怎么办？

嘿，我来帮你搞定这个问题！先说说你原来的代码为啥没用：

• $('input:empty')完全用错了——:empty选择器是用来匹配**没有任何子节点（包括文本节点）**的元素，但input是自闭合标签，它的内容是存在value属性里的，不是子节点，所以这个选择器根本找不到你要的空白输入框。
• $('li:empty')也不会生效，因为你的li里面有input元素，哪怕input是空的，li也不算“空”节点。

正确的实现方法 #

根据你的需求，分两种场景给你方案：

1. 仅移除所有空白文本输入框

如果只需要删掉value为空（包括只有空格的情况）的文本输入框，用filter()方法来筛选：

// 筛选所有文本输入框中值为空（去空格后）的元素并移除
$('input[type="text"]').filter(function() {
  return $.trim($(this).val()) === '';
}).remove();

如果你的空白输入框不只是text类型（比如password、number），把选择器改成input就行。要是不需要过滤空格，直接去掉$.trim()，用$(this).val() === ''。

2. 移除空白输入框+连带移除对应的li

如果要把包含空白输入框的li也一起删掉，有两种方式：

方式一：直接筛选符合条件的li并移除

$('li').has('input[type="text"]').filter(function() {
  // 检查li里的input值是否为空（去空格后）
  return $.trim($(this).find('input').val()) === '';
}).remove();

方式二：先删空白input，再删空li
这种更直观，先处理input，再清理空的li：

// 第一步：移除空白输入框
$('input[type="text"]').filter(function() {
  return $.trim($(this).val()) === '';
}).remove();
// 第二步：移除现在变成空的li
$('li:empty').remove();

这样就能精准处理你要的场景啦！

内容的提问来源于stack exchange，提问作者verlager