Den här sidan dokumenterar några av Confluence JavaScript-komponenter som du kan använda i ditt insticksprogram.

Inmatningsfält för automatisk komplettering

Confluence tillhandahåller ett antal komponenter för automatisk komplettering av olika innehållstyper. Du behöver helt enkelt rätt klass på inmatningsfältet. Du kan också konfigurera autokompletteringen med några ”data-”-attribut (se exempel i tabellen längre fram på den här sidan). händelser avfyras på inmatningselementet via jQuery-händelsesystemet, så klienterna kan lyssna på de dokumenterade händelserna.

Attributnamn

Beskrivning

data-mall

En mall som används för att fylla på värdet för inmatningen.

data-none-message

Ett meddelande som ska visas när inga resultat returneras.

data-max

Maximalt antal sökresultat, standardvärdet är 10 om det inte är definierat.

data-alignment

Avstämning av rullgardinsmenyn för automatisk komplettering i förhållande till inmatningsfältet. Standardinställningen är ”vänster”.

data-dropdown-target

En målelementväljare för att placera den autokompletterande rullgardinsmenyn i.

  • Om inget anges kommer den att placeras i en div omedelbart efter inmatningsfältet.

data-target

En målelementväljare som uppdaterar sitt värde med det värde som tillhandahålls av data-template.

  • Det här är typiskt användbart när du vill visa användarens fullständiga namn i inmatningsfältet, men skicka in användarnamnet till servern, så att ett annat inmatningselement måste uppdateras.

Events thrown:

  • open.autocomplete-content
  • selected.autocomplete-content

Space autocomplete 

1
<input class="autocomplete-space" data-max="10" data-none-message="No results" data-template="{name}">

Attachment autocomplete 

1
<input class="autocomplete-attachment" data-max="10" data-none-message="No results" data-template="{fileName}">

Page autocomplete 

1
<input class="autocomplete-page" data-max="10" data-none-message="No results" data-template="{title}">
<input class="autocomplete-page" data-max="10" data-none-message="No results" data-template="{title}">

Autokomplettering av blogginlägg 

1
<input class="autocomplete-blogpost" data-max="10" data-none-message="No results" data-template="{title}">

Sida och blogginlägg 

1
<input class="autocomplete-confluence-content" data-none-message="No results" data-template="{title}">

Allt innehållsutfyllnad

Detta inkluderar sidor, bloggar, utrymmen, användare och bilagor.

1
<input class="autocomplete-search" data-none-message="No results" data-template="{title}">

Användarens autokomplettering

Denna komponent kastar användarspecifika händelser:

  • open.autocomplete-user
  • selected.autocomplete-user
1
<input class="autocomplete-user" data-none-message="No users found" data-template="{username}">

Användare hover

För att visa mer information om användaren när den hoverar över användarlänken, kan du lägga till klassen confluence-userlink och dataattributet data-username till din länktagg.

Events thrown:

  • hover-user.open
  • hover-user.follow
1
<a class="confluence-userlink" data-username="admin">A. D. Ministrator</a>