Question

我确信这很简单，但我被困住了。

我有输入，当输入值时，我想将此值附加到<span>元素。从输入中删除值后，我还想将其从<input type="search" id="searchName" type="text"> <div id="searchFilter"> <p><span id="filterName"></span></p> </div> $('#searchName').keyup(function() { if ($('#searchName').length > 0) { $("#filterName").text('Name: ' + $('#searchName').val()); } else { $("#filterName").empty(); } });元素中删除。

我遇到的问题是删除了输入值，但html'名称'仍然存在。

https://cran.r-project.org/web/packages/SOMbrero/vignettes/doc-numericSOM.html

{{1}}

感谢任何帮助。

Answer 1

评估val()的长度，而不是元素本身的长度：

$('#searchName').keyup(function() {
  if ($('#searchName').val().length > 0) {
    $("#filterName").text('Name: ' + $('#searchName').val());
  } else {
    $("#filterName").empty();
  }
});

Fiddle

Answer 2

有一些修改。没关系： - ）

＆＃13;

$('#searchName').on("keyup",function() {
  if ($('#searchName').val() != "") {
    $("#filterName").text('Name: ' + $('#searchName').val());
  } else {
    $("#filterName").text("");
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="search" id="searchName" type="text">
<div id="searchFilter">
  <p><span id="filterName"></span></p>
</div>

＆＃13;

Answer 3

将if中的条件更改为：

$('#searchName').val().length > 0

Answer 4

如果你将keyup分配给body元素，而不是输入框本身，那么它将注册事件并工作 -

$('body').keyup(function() {
  if($('#searchName').length > 0) {
    $("#filterName").text('Name: ' + $('#searchName').val());
  } else {
    $("#filterName").empty();
  }
});

小提琴链接 - https://jsfiddle.net/age3nyph/4/

Answer 5

我会处理＆＃39;搜索＆＃39;和＆＃39; keyup＆＃39;用户点击“＆＃39; x＆＃39;和用户在该字段中键入。见JSFiddle Example

$('#searchName').on('keyup', function() {
updateFilter(this);
});

$('#searchName').on('search', function(){
updateFilter(this);
});

function updateFilter(element){
if ($(element).val().length > 0) {
    $("#filterName").text('Name: ' + $(element).val());
 } else {
$("#filterName").empty();
 }
};

编辑：更新指向JSFiddle安装程序的链接以使用JQuery。原始链接排除了更新。

为什么我的元素没有像预期的那样被清空？

5 个答案: