如何隐藏在jquery mobile中键入任何内容时显示的文本框中的删除按钮

时间:2014-04-16 10:51:52

标签: jquery html jquery-mobile jquery-mobile-button

您好我想删除在jquery mobile中输入任何内容时显示的文本框中的删除按钮。当我点击重置按钮文本框清除但删除按钮未被隐藏时

这是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('');
 });

2 个答案:

答案 0 :(得分:0)

$('#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();
});

使用此脚本。

Fiddle

答案 1 :(得分:0)

这让我在花了几个小时后帮我解决了这个问题。我以编程方式单击了jquery中的按钮

jsfiddle

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

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