[RAILS] [Für Super-Anfänger] Verwendung des Autofokus: true

Autofokus-Attribut

"Autofokus: true" bedeutet, dass sich der Cursor nach dem Laden der Seite zu dem Teil bewegt, in dem das Autofokus-Attribut beschrieben und der Eingabestatus eingegeben wird.

Konkretes Beispiel

Wenn Sie von der Listenseite zu Meine Seite wechseln und versuchen, den Namen zu ändern. 　 Wenn Sie auf der Listenseite auf die Schaltfläche Meine Seite klicken und zu Meine Seite wechseln, wird Meine Seite mit bewegtem Cursor angezeigt, ohne den Formteil Ihres Namens auszuwählen. So können Sie es sofort bearbeiten!

⚠️ Beachten Sie, dass Autofokus: true auf einen pro HTML-Datei beschränkt ist.

Wie schreibt man

Hier wird der Code des obigen Bildes so eingeführt, wie er ist. Lassen Sie uns verstehen, wie "autofocus: ture" im Ganzen verwendet wird. Umgebung: Rails 6.0.0, VScode 1.46, macOS Catalina 10.15

app/views/users/show.html.erb

<div class="account-page">
  <div class="account-page-title">
    <h1>Meine Seite</h1>
  </div>
  <div class="account-info">
    <h2>Nutzerinformation</h2>
  </div>
  <div class="account-page-form">
    <%= form_for(current_user) do |f| %>
      <div class="form-field">
        <div class="form-field-name">
          <%= f.label :name %>
        </div>
        <div class="form-field-name">
          <%= f.text_field :name, autofocus: true %>
        </div>
      </div> 
      <div class="form-field">   
        <div class="form-field-email">
          <%= f.label :email %>
        </div>
        <div class="form-field-email">
          <%= f.email_field :email %>
        </div>
        <br>
      </div>
      <%= f.submit "Aktualisieren" %>
      <br>
      <%= link_to "Ausloggen", destroy_user_session_path, method: :delete%>
    <% end %>
  </div>
</div>

abschließend

URL der Referenzseite → Uhyohyoweb Wie war der Artikel über "Autofokus: wie man true verwendet"? Der Autofokus selbst ist sehr einfach, aber wenn Sie es nicht wissen, werden Sie gefragt: "Was ist das?" Es ist zu leicht zu erlernen, also habe ich diesen Artikel geschrieben! Ich hoffe es hilft dir auch nur ein wenig zu verstehen. Bitte weisen Sie auch auf Punkte hin, die Sie nicht möchten. (Da es der erste Beitrag und ein Anfänger ist, führen alle Vorschläge zum Lernen!) Vielen Dank an alle, die bis zum Ende zugesehen haben. Wir sehen uns in einem anderen Artikel ~~!