2016-07-06 11 views
0

Ich habe meine app von Polymer v0.5 zu v1.2.4 aktualisiert und ich habe ein paper-dialog Element in den index.html Seite meiner App. Ich habe auch eine paper-button auf der gleichen Seite.Polymer v1.2.4 - Kann Tab/Shift-Tab Hintergrund Tasten bei Kulisse Element

<body> 
    <paper-button raised>view items</paper-button> 
    <paper-dialog id="agreement_dialog" modal> 
      Do you agree to proceed ? 
      <paper-button raised on-click="agreementAccepted" autofocus> 
      I Agree 
      </paper-button> 
      <paper-button raised on-click="agreementDeclined"> 
      I Decline 
      </paper-button> 
    </paper-dialog> 
</body> 

Nun ist die Frage, wenn agreement_dialog Dialog mit Hintergrund geöffnet wird, noch der Anwender ist in der Lage Tab/Shift-Tab auf die Schaltfläche hinter dem Hintergrund dh <paper-button raised>view items</paper-button>

Gibt es eine Möglichkeit, diese behaivour Beschrän in Polymer v1.2.4, weil dies in v0.5 nicht der Fall war.

HINWEIS: Wenn die tabindex der auf -1 view items Papier-Taste eingestellt ist, dann funktioniert es finden, aber dies ist eine Art hackish, weil ich viele andere Tasten und Symbol-Tasten, für die muss ich Setzen Sie tabindex = -1 für jedes Element.

Antwort

0

Es sieht so aus, als ob Sie das with-backdrop Attribut auf paper-dialog geerbt von iron-overlay-behavior verwenden. Für kompliziertere Fälle kann es erforderlich sein, mit _focusableNodes Getter von iron-overlay-behavior zu verwirren.

paper-dialog: withBackdrop

iron-overlay-behavior:

Stellen Sie die with-backdrop Attribut einen Hintergrund hinter dem Overlay angezeigt werden soll. Der Hintergrund ist , angehängt an <body> und ist vom Typ <iron-overlay-backdrop>. Auf der Doc-Seite finden Sie die Optionen . Darüber hinaus wird with-backdrop den Fokus innerhalb des Inhalts in das helle DOM wickeln. Überschreiben Sie die _focusableNodes Getter , um ein anderes Verhalten zu erreichen.

+0

aber modales Attribut ist mit Hintergrund (wie im Dokument https://elements.polymer-project.org/elements/paper-dialog#property-modal), die ich bereits verwende. – Roy