AMP-html如何在用戶點擊輸入時防止燈箱關閉

Question

我有一個amp-lightbox和一個表單。

<amp-lightbox id="search-word" 
 
        layout="nodisplay"> 
 
     <div class="lightbox" 
 
      on="tap:search-word.close" 
 
      role="button" 
 
      tabindex="0"> 
 
      
 
      <form id="search-word" role="search" action="https://localanagrammer.com/" target="_top"> 
 
       <div class="input-group"> 
 
        <input type="text" id="searchWord" class="form-control" placeholder="enter scrabble word" data-ng-model="keyword" autocomplete="off" autofocus> 
 
        <span class="input-group-btn"> 
 
         <button class="btn btn-default" type="button" data-ng-click="doSearch(keyword)"> 
 
          <span class="fa fa-search" aria-hidden="true"></span> 
 
         </button> 
 
        </span> 
 
       </div> 
 
      </form> 
 
     </div> 
 
    </amp-lightbox>

當我嘗試點擊文本輸入的收藏夾被關閉。

問題是：什麼是防止關閉的正確方法？從這個documentation基於

Answer 1

，設置在收藏夾中的一個或多個元件的on屬性和設置它的方法來close將關閉收藏當元件被竊聽或點擊。

我認爲這個代碼on="tap:search-word.close"是當你點擊文本輸入時燈箱關閉的原因。

Answer 2

我已經通過在內部元素中打開一個打開的動作來解決它。這裏類似的情況是（這是一個呈現AMP HTML的React代碼）：

 <amp-lightbox 
      id="mylightbox" 
      on="tap:mylightbox.close" 
      class="dark-lightbox-background" 
      layout="nodisplay"> 
      <div 
       class="container" 
       on="tap:mylightbox.open"> 

       <!-- content placed here --> 

      </div> 
     </amp-lightbox>