3

ポップアップダイアログの閉じるアイコンを削除する方法を知っている人はいますか?

http://jquerymobile.com/test/docs/pages/dialog/index.html#&ui-state=dialog

4

8 に答える 8

8

Closeダイアログの構造を見ると、以下の CSS を使用してボタンを非表示にできることが容易に理解できます。

.ui-header > .ui-btn { display: none; }

.ui-btnこれにより、のすべてが非表示になることに注意してくださいui-header。それが望ましくない場合は、単純なスクリプトを記述して、Closeボタンだけを非表示にすることができます。

ページ内のすべてのダイアログについて:

$(function () {
    $('.ui-btn', '.ui-header').filter (function () {
        return $.trim($(this).find('span.ui-btn-text').text()) == 'Close'; 
    }).hide();
});

ID を持つ特定のダイアログの場合pageId:

$(function () {
    $('.ui-header .ui-btn', '#pageId').filter (function () {
        return $.trim($(this).find('span.ui-btn-text').text()) == 'Close'; 
    }).hide();
});

ダイアログ構造の詳細については、以下を参照してください。

以下は、(完全な構造を参照)Xの冒頭にある (閉じるアイコン) です。div

<a href="#" class="ui-btn-left ui-btn ui-btn-up-d ui-shadow ui-btn-corner-all ui-btn-icon-notext" title="Close">
  <span class="ui-btn-inner ui-btn-corner-all">
     <span class="ui-btn-text">Close</span>
     <span class="ui-icon ui-icon-delete ui-icon-shadow">&nbsp;</span>
   </span>
 </a>

完全な構造[読みやすくするためにデータ属性をクリーンアップ]

<div role="dialog" class="ui-dialog-contain ui-corner-all ui-overlay-shadow">
  <div class="ui-corner-top ui-header ui-bar-d" role="banner">
    <a href="#" class="ui-btn-left ui-btn ui-btn-up-d ui-shadow ui-btn-corner-all ui-btn-icon-notext" title="Close">
        <span class="ui-btn-inner ui-btn-corner-all">
          <span class="ui-btn-text">Close</span>
          <span class="ui-icon ui-icon-delete ui-icon-shadow">&nbsp;</span>
        </span>
     </a>
     <h1 class="ui-title" role="heading" aria-level="1">Dialog</h1>
  </div>
  <div class="ui-corner-bottom ui-content ui-body-c" role="main">
    Dialog content
    <a href="#" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-up-b">
      <span class="ui-btn-inner ui-btn-corner-all">
        <span class="ui-btn-text">Sounds good</span>
      </span>
    </a>       
    <a href="#" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-up-c">
       <span class="ui-btn-inner ui-btn-corner-all">
         <span class="ui-btn-text">Cancel</span>
       </span>
     </a>    
  </div>
</div>
于 2012-11-05T22:01:01.667 に答える
2

HTMLは次のとおりです。

<a href="#" class="ui-btn-left ui-btn ui-btn-up-d ui-shadow ui-btn-corner-all ui-btn-icon-notext" title="Close">
  <span class="ui-btn-inner ui-btn-corner-all">
     <span class="ui-btn-text">Close</span>
     <span class="ui-icon ui-icon-delete ui-icon-shadow">&nbsp;</span>
  </span>
</a>

そして、あなたがしなければならないのは

$(".ui-btn[title='close']").remove();

また

$(".ui-btn[title='close']").hide();

また

$(".ui-btn[title='close']").css('display', 'none');

また

$(".ui-btn[title='close']").attr("hidden", "hidden");
于 2012-11-11T21:32:32.777 に答える
1

ダイアログがロードされたら、以下を呼び出します。

$(".ui-dialog a[data-icon='delete']").remove();
于 2012-10-26T11:18:35.643 に答える
1

HTML コード:

 <div data-role="dialog" id="pageId">
    <div data-role="header" data-theme="c" class="ui-header">
      <h2>your Heading</h2>
    </div>
    <div data-role="content">
        <p>Your Message.</p>
     </div>
 </div>

CSS コード:

   #pageId div .ui-header a { display:none;}
于 2012-11-05T06:57:45.420 に答える
1

HTML コード:

 <div data-role="dialog" id="pageId">
    <div data-role="header" data-theme="c" class="ui-header">
      <h2>your Heading</h2>
    </div>
    <div data-role="content">
        <p>Your Message.</p>
     </div>
 </div>

CSS コード:

   #pageId div .ui-header a { display:none;}
于 2012-12-11T11:51:42.030 に答える
1

<h1>ページにヘッダーを含めないでください。data-role="header"

于 2012-10-26T14:14:13.777 に答える
0

あなたのコメントから、私はあなたがこのようなものが欲しいと思います:

var dialog = ...
$("a[data-icon='delete']", dialog).css("display", "none"); // Hide it
// or
$("a[data-icon='delete']", dialog).remove(); // Remove it

remove()-ing は、アイコンが DOM のその場所にあることを期待するモジュールで問題を引き起こす可能性があります。したがって、非表示のバリアントをお勧めします。

私の推測が間違っていて、すべてのダイアログからすべての X を削除したい場合は、Curt のセレクターを使用してください。(特に痛くないです)

(申し訳ありませんが、カート、あなたの答えに近いことは知っていますが、賢明なコメントには長すぎました。)

于 2012-10-29T07:55:33.100 に答える
0

閉じるボタンが必要ない場合は、ポップアップ ダイアログを使用してください http://jquerymobile.com/test/docs/pages/popup/index.html#&ui-state=dialog

于 2012-10-29T08:00:27.443 に答える