如何根据所输入的文本字段

Question

隐藏或显示类清除文本字段

我已经通过名称明确提出了一个类中的文本

http://jsfiddle.net/Loa3go9w/1/

如何使类（searchClear_btn）只显示文本输入有一些数据或消失的类？

$("#devsearchinputtext").val('This is test'); 
$("#devsearchinputtext").after('<a class="searchClear_btn">Clear</a>'); 
$(document).on('click', '.searchClear_btn', function(event) { 
    $("#devsearchinputtext").val(''); 
    event.stopImmediatePropagation(); 
     event.preventDefault(); 
     return false; 
}); 

可否请你让我知道如何实现这一目标

Answer 1

如果输入有文字，则可以绑定keyup事件并显示按钮。

$("#devsearchinputtext").on('keyup', function(){ 
    $('.searchClear_btn').toggle(!!this.value && !!this.value.length) 
}).trigger('keyup'); 

DEMO

Answer 2

你要听的文本字段的任何输入的变化，并检查文本框的值的长度大于0。

$('#devsearchinputtext').on('input',function(e){ 
    if ($(this).val().length > 0) { 
     $(".searchClear_btn").hide(); 
    } else { 
     $(".searchClear_btn").show(); 
    } 
}); 

的input事件通常比keyup更有效，因为它也监听比如复制和粘贴的事件。