Menyn klickas inte med musen i webbläsaren. Hantera högerklicka med musen (på kontextmenyn). Vad är sammanhangsmenyn

Innehållsmenyär menyn som visas när du högerklickar på skärmen. Vanligtvis används sådana menyer för att göra det lättare att utföra favoritåtgärder, som att sortera mappar och filer, öppna ett nytt programfönster eller komma åt systeminställningar.

Under många år hänvisar termen "kontextmeny" främst till inhemska applikationer. Nu har vi dock möjlighet att dra nytta av det även i webbapplikationer. Ett exempel är filhanteraren i Gmil. Den här menyn implementeras med hjälp av javascript-kod:

I framtiden kommer vi att kunna skapa snabbmenyer för HTML5-baserade webbplatser. Vi inbjuder dig att bekanta dig med detta tillvägagångssätt.

Utveckling av snabbmeny

HTML5 introducerade oss för 2 nya element: meny och menuitem, och de låter dig skapa snabbmenyer. För att webbläsaren ska behandla menyelementet som en "sammanhangsmeny" måste vi ställa in menytypen till kontext och även ge den ett unikt ID.

Nedan är ett exempel där vi skapar en snabbmeny med dessa egenskaper.

Vi har också möjlighet att lägga till undermenyer genom att förgrena menyelementet så här:

Nu, för att snabbmenyn ska visas på skärmen när du klickar på höger musknapp, använder vi ett nytt HTML-attribut som kallas contextmenu. Detta attribut används för att identifiera menyn med angivet ID. Med vårt exempel ovan kan vi definiera vår sammanhangsmeny med contextmenu=context-menu-id.

Vi kan ställa in ett attribut på body-taggen om vi vill använda snabbmenyn på hela sidan. Vi kan också lägga till det i HTML-elementet så att denna meny används uteslutande inom detta element.

Nu kommer en ny sammanhangsmeny att dyka upp i menyn Operativsystem, som visas i exemplet nedan.

Lägger till en ikon

Vi är säkra på att många av er har sett snabbmenyer som använder ikoner. I vissa fall kan en ikon vara ett utmärkt visuellt hjälpmedel för att hjälpa användare att hitta menyn. Dessutom låter det också användare förstå vad menyn är till för.

Vi kan också lägga till en ikon i vår HTML5-kontextmeny med hjälp av ikonattributet:

Här är vad vi kommer att se i webbläsarfönstret.

Få menyn att fungera

Vid det här laget fungerar inte vår nya snabbmeny vid klick. Vi kan dock mycket lätt få honom till sinnes med hjälp av liten kod javascript. I vårt exempel heter menyn E-postval. Denna meny låter användare skicka vald text via e-post.

För att få det att fungera, låt oss lägga till en funktion som gör att användare kan använda den markerade koden.

Funktion getSelectedText() (
var text = "";
if(window.getSelection) (
text = window.getSelection().toString();
) else if (document.selection && document.selection.type != "Kontroll") (
text = document.selection.createRange().text;
}
returnera text;
};
Vi skapar sedan en annan funktion, låt oss säga sendEmail() , som öppnar e-postklienten. Ämnet för brevet kommer att vara den inmatade texten från dokumenthuvudet, och brevets brödtext kommer att fyllas med den valda texten.

funktion skickaEmail() (
var bodyText = getSelectedText();
window.location.href = "mailto:?subject="+ document.title +"&body="+ bodyText +"";
};
Slutligen lägger vi till denna funktionalitet till vår meny via onclick-attributet.

E-postval
Vi har tidigare berättat om hur du använder HTML5 EditableContent som gör att vi kan redigera webbinnehåll direkt på sidan. Vi kan använda denna funktion, lägga till den i vår meny som heter "Redigera innehåll".

Sammanfattningsvis

Personligen var vi väldigt nöjda med detta ny funktion. Vi ser många möjligheter i det. Tyvärr är det bara Firefox som stöder denna funktion när detta skrivs. Vi hoppas att andra webbläsare snart kommer att ansluta till den.

Du kan se en demo nedan (fungerar bara i Firefox).

I den här handledningen tar vi en titt på en sällan nämnda HTML5-funktion, kontextmenyn. Kanske har du aldrig hört talas om en sådan meny tidigare, men i vissa situationer kan den vara oerhört användbar.

Vad kan kontextmenyattributet användas till? Det låter dig lägga till olika alternativ till högerklicksmenyn i webbläsaren med bara några rader HTML, även när Javascript är inaktiverat. Även om detta för närvarande behändigt verktyg endast tillgänglig i Firefox.

Så här fungerar det:

Att använda sammanhangsmenyn är mycket enklare än det kan tyckas vid första anblicken. Du måste lägga till kontextmenyattributet:

Sedan skapar vi menyn:

Id-attributet måste matcha kontextmenyattributet. Det är alltså möjligt att använda olika sammanhangsmenyer för olika delar av sidan.

Sedan lägger vi till menyalternativ. Först infogar vi en menypost med text och en ikon, sedan lägger vi till en länk för att sända den aktuella sidan till Facebook, och slutligen infogar vi en länk för att uppdatera sidan. Det visar sig en snabbmeny med tre objekt:

Du kan också skapa undermenyer:

En mycket intressant och användbar egenskap hos HTML5. Men dess tillämpning är endast begränsad till webbläsaren Firefox.

Prestandan för alla enheter. I händelse av misslyckanden, haverier är det inte alltid nödvändigt att ringa specialister, ibland betalar för sina tjänster till ganska höga priser. Många brister, fel kan korrigeras oberoende. Dessa typer av fel, fel inkluderar när höger musknapp inte öppnar snabbmenyn. Hur ska man agera i sådana fall?

Först bör du ta reda på varför operationen misslyckas, varför snabbmenyn inte fungerar. windows-menyn 10. Det finns flera möjliga orsaker till detta:

registret rör sig med föråldrade filer;
brist på program som ingår i snabbmenyn, deras instabila funktion.

Låt oss överväga vad vi ska göra i dessa fall, hur man ändrar situationen när högerklicksmenyn inte öppnas.

Om högerklickskontextmenyn inte visas på grund av att registret är belamrat med föråldrade filer, rekommenderar vi att du använder ett verktyg för att rengöra, till exempel Glary Utilities. Glary Utilities är en uppsättning systemjusteringar, verktyg som hjälper till att skydda, finjustering, förbättra datorns prestanda. Med hjälp av setet kan du ta bort onödiga filer som täpper till systemet, registerposter som sedan länge är föråldrade, optimera RAM-minnet, hantera start, optimera minne och andra funktioner som är användbara för att datorn ska fungera bra. Glary Utilities kan laddas ner gratis.

När du har ställt in inställningarna rengör du enheten från skräpfiler genom samma verktyg, rensa registret och därigenom öka hastigheten på datorn.

Frys buggfix

Om när du klickar på RMB på en fil eller mapp, snabbmenyn på skrivbordet inte fungerar, datorn fryser, nyckeln inte svarar på kommandon, kan du fixa denna frysning på två sätt, vi rekommenderar att du gör båda i följd . Innan du fortsätter med någon av dem måste du ha administratörsrättigheter. Du måste arbeta med registret, här måste du vara försiktig, om du gör det felaktigt kan systemet misslyckas. Se därför till att skapa en systemåterställningspunkt när du startar processen med att åtgärda fel innan du tar bort något.

En "tyst" frysning orsakas vanligtvis av ett instabilt program, ett fruset program eller när en länk i snabbmenyn pekar på en icke-existerande resurs.

Metod ett

Följ stegen i följd:

Kontrollera listan som visas för de program du redan har avinstallerat.
Om det finns ett program som du tagit bort i listan, ta bort det från registret. Innan du tar bort någon registernyckel rekommenderar vi att du skapar en säkerhetskopia av den för att spara ifall du behöver återställa den.

Metod två

Algoritmen för den andra metoden, när Windows 10-kontextmenyn inte öppnas, kommer att vara som följer.

Öppna registerredigeraren enligt beskrivningen i steg 1-2 i föregående metod.
Öppna undernyckeln HKEY_CLASSES_ROOT,
I den kommer du att se flera undersektioner med namn som "name_programm.exe", "name_programm.dll". Kontrollera var och en i tur och ordning genom att klicka på LMB, fram till undersektionen "kommando". Alla underavdelningar måste vara öppna. Om den inte öppnas, i den högra delen av fönstret, se närvaron av parametern "NoOpenWith". Det finns ingen sådan parameter - skapa den. Följ stegen för vad:

När du har hittat undersektionen "kommando", klicka på LMB, kontrollera om parametern "(Standard)" finns på höger sida. Parametern måste ställas in på applikationen eller nätverksresurs som finns på datorn.

Om parametern hänvisar till en resurs som inte längre finns, bör hela avsnittet som börjar med namnet på denna resurs, programmet, tas bort. Glöm inte att skapa en säkerhetskopia innan du raderar för återställning om det behövs. Ta bort genom att klicka på namnet på avsnittet med RMB, klicka sedan på "Ta bort" - "Ja".

Efter att ha slutfört de två metoderna bör snabbmenyn öppnas, datorn slutar frysa när RMB klickar på filen.

Det är inte svårt att få snabbmenyn att fungera, kom bara ihåg att varje försök att ändra registret kan leda till instabil PC-drift, så glöm inte att skapa återställningspunkter, arkivkopior av program som ska tas bort. När höger musknapp inte öppnar snabbmenyn, följ instruktionerna ovan i följd, tillämpa alla metoder, felet kommer att åtgärdas.

Har du märkt att högerklicka på bilder på vissa sajter inte gör någonting. Det verkar som om knappen klickar på tomgång och webbläsaren bryr sig inte om det - den "fryser och tänker". I verkligheten blockerar webbläsaren helt enkelt klick genom att ta emot ett sådant kommando från JavaScript-skriptet på den inlästa sidan.

Hur lås upp höger knapp klicka på en bild för att spara den för offlinevisning? I de flesta webbläsare räcker detta för att "gräva" i de avancerade inställningarna JavaScript.. Så...

Om du har " Opera»:
1. Följ sökvägen "Verktyg" -> "Allmänna inställningar";
2. I fönstret som visas, stanna vid "Innehåll"-objektet och hitta knappen "Konfigurera JavaScript" (se Fig. 1).

3. Genom att klicka på den öppnar du fönstret för detaljerade JavaScript-inställningar och avmarkerar rutan bredvid raden "Blockera höger knapp".
Efter bekräftelse (klickning på "Ok") blir denna knapp "gratis" för samtal till snabbmenyn. För övrigt i firefox» För att låsa upp den högra knappen måste du avmarkera rutan bredvid ett sådant objekt (se fig. 2).

I andra avancerade webbläsare tas blockeringen av höger knapp bort på samma sätt – genom samma avancerade JavaScript-inställningar.

Webbapplikationer blir idag ett nytt steg i utvecklingen av webben. Det är långt ifrån vanliga informationssajter. Gmail och Dropbox är exempel på avancerade webbapplikationer. I takt med att funktionaliteten, tillgängligheten och användbarheten av webbapplikationer ökar, ökar också behovet av att öka effektiviteten i deras användning. Den här guiden kommer att titta på att skapa en så användbar sak som din egen snabbmeny, och i synnerhet:

Låt oss ta reda på vad en snabbmeny är och varför den behövs.
Vi implementerar vår sammanhangsmeny med JS och CSS.
Låt oss beröra bristerna och begränsningarna i det tillvägagångssätt som används för att veta vilka problem som kan varna oss när vi rullar ut allt detta i produktionen.

Vad är en snabbmeny?

Enligt Wikipedia är sammanhangsmenyn en meny som visas när användaren interagerar med GUI(genom att trycka på höger musknapp). Kontextmenyn innehåller en begränsad uppsättning möjliga åtgärder, som vanligtvis associeras med det valda objektet.

Högerklicka på skrivbordet på din dator kommer att få upp en snabbmeny operativ system. Härifrån kan du förmodligen skapa en ny mapp, få lite information och göra något annat. Kontextmenyn i webbläsaren låter till exempel få information om sidan, se dess källkod, spara en bild, öppna en länk i en ny flik, arbeta med klippbordet och så vidare. Dessutom beror uppsättningen av tillgängliga åtgärder på exakt var du klickade, det vill säga på sammanhanget. Detta är standardbeteendet som fastställts av webbläsarutvecklare [ Och tillägg till det].

Webbapplikationer börjar sakta ersätta vanliga snabbmenyer med sina egna. Gmail och Dropbox är bra exempel. Frågan är bara hur man gör en egen snabbmeny? Högerklickning i webbläsaren aktiverar kontextmenyhändelsen. Vi måste åsidosätta standardbeteendet och göra det så att vår egen meny visas istället för standardmenyn. Det här är inte så svårt, men vi kommer att förstå det steg för steg, så det kommer att bli ganska omfattande. Till att börja, låt oss skapa grundläggande struktur applikationer så att exemplet som utvecklas inte är helt ur verkligheten.

Uppgiftslista

Låt oss föreställa oss att vi skapar en applikation som låter oss upprätthålla en lista med uppgifter. Jag förstår att du förmodligen redan är otroligt trött på alla dessa uppgiftslistor, men så är det. Ansökningssidan innehåller en lista över väntande uppgifter. För varje uppgift finns en typisk uppsättning CRUD-åtgärder tillgänglig: få information om uppgiften, lägg till en ny, redigera, ta bort.

Från översättaren
Översättning på platser är ganska gratis, men inte på bekostnad av mening eller innehåll. Allt som inte är direkt relaterat till originalet finns med i noterna.
Med förslag, önskemål och kommentarer, som vanligt, i LAN.

Tematiskt material: