jquery - 当您在 jQuery mobile 中键入任何内容时，如何隐藏文本框中的删除按钮

Question

我想删除文本框中的删除按钮，当您在 jQuery 移动中键入任何内容时会显示该按钮。当我单击重置按钮时，文本框已清除，但删除按钮未隐藏。

这是jsfiddle。

html

<div id="dvSearch" data-role="fieldcontain" class="ui-hide-label" data-theme="a">
    <div class="clsNote">Entrer le nom du membre que vous desirez contacter</div>
    <label id="lblSearch" for="txtsearch">Search</label>
    <input type="search" id="txtsearch" data-i18n="[placeholder]attr.placeholderSearch;" data-theme="b" />
</div>
<a href="javascript:void(0);" id="btnReset" class="LnkButton ui-icon-alt ui-btn ui-btn-up-a ui-shadow ui-btn-corner-all ui-btn-inline" data-theme="a" data-role="button" data-inline="true" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span">
                                        <span class="ui-btn-inner">
                                            <span class="ui-btn-text">Reset</span>
                                        </span>
 </a>

jQuery

 $('#btnReset').on('click', function (e) {
     // $(".ui-icon-delete").hide();//**this line doesnt work**
     $("#txtsearch").val('');
 });

Answer 1

在我花了几个小时弄清楚后，这对我有所帮助。我以编程方式单击了 jquery 中的按钮

jsfiddle

  $('#btnReset').on('click', function (e) {
     $(".ui-icon-delete").trigger('click');      
 });

详情 http://demos.jquerymobile.com/1.0a2/experiments/api-viewer/docs/trigger/

Answer 2

$('#btnReset').on('click', function (e) {
     $(".ui-input-clear").hide();
     $("#txtsearch").val('');
 });

 $('#txtsearch').keyup(function(){
     var content = $('#txtsearch').val();
     if(content != '')
     {
         $(".ui-input-clear").show();
     }
     else
     {
         $(".ui-input-clear").hide();
     }
});
$(".ui-input-clear").click(function(){
    $(this).hide();
});

使用此脚本。

小提琴