Jak można wybrać element <img> programowo za pomocą JavaScript?

Mam <img> w dokumencie HTML, który chciałbym podświetlić tak, jakby użytkownik podświetlił go za pomocą myszy. Czy istnieje sposób, aby to zrobić za pomocą JavaScript?Jak można wybrać element <img> programowo za pomocą JavaScript?

Potrzebuję go tylko do pracy w Mozilli, ale wszelkie informacje są mile widziane.

EDYCJA: Powód, dla którego chcę wybrać obraz, nie jest tak, aby był podświetlony, ale dzięki temu mogę skopiować wybrany obraz do schowka przy użyciu XPCOM. Img musi więc zostać wybrany, aby to zadziałało.

Źródło

2008-09-24 Joel Anair

Oto przykład, który wybiera pierwsze zdjęcie na stronie (który będzie logo przepełnienia stosu, jeśli przetestować go na tej stronie w Firebug):

var s = window.getSelection() 
var r = document.createRange(); 
r.selectNode(document.images[0]); 
s.addRange(r)

stosownej dokumentacji:

Źródło

2008-09-24 01:42:34

Idealny. Właśnie tego szukam. –

Co 's.addRange (r)' robi? Miałem problemy tutaj: http://stackoverflow.com/questions/42298386/select-html-z-frame-using-javascript-jquery –

-1

Możesz zamienić źródło obrazu, jak w img.src = "otherimage.png";

Rzeczywiście zrobiłem to w pewnym momencie i są rzeczy, które możesz zrobić, aby załadować wstępnie obrazy.

Ustanowiłem nawet specjalne atrybuty elementów graficznych, takich jak swap-image = "otherimage.png", następnie przeszukałem wszystkie elementy, które je zawierały, i skonfigurowałem obsługę automatycznych zamiany obrazów ... możesz to zrobić trochę fajnych rzeczy.

Przykro mi, ale źle zrozumiałem pytanie! ale tak czy owak, dla tych z was, którzy są zainteresowani robieniem tego, o czym mówię, tutaj jest przykład tego, co mam na myśli (prosta implementacja, sugerowałbym użycie frameworków takich jak jQuery, aby go ulepszyć, ale po prostu coś, co sprawi, że będziesz działać):

<html> 
<body> 
<script language="javascript"> 
function swap(name) { 
    document.getElementById("image").src = name; 
} 
</script> 
<img id="image" src="test1.png" 
    onmouseover="javascript:swap('test0.png');" 
    onmouseout="javascript:swap('test1.png');"> 
</body> 
</html>

Źródło

2008-09-24 01:21:42

Dzięki, Mike. Powinienem być bardziej szczegółowy o tym, co chciałem zrobić. Obraz nie może być podświetlony. To musi być rzeczywiście podświetlone. –

Nie, nie twoja wina, źle odczytałem kilka słów ... przepraszam! –

-2

Nadaj imgowi identyfikator. Użyj document.getElementById ("id").

<script type="text/javascript" language="javascript"> 
function highLight() 
{ 
    var img = document.getElementById('myImage'); 
    img.style.border = "inset 2px black"; 
} 
</script> 
<img src="whatever.gif" id="myImage" onclick="hightLight()" />

EDIT :: Można spróbować .focus dać koncentrować.

Źródło

2008-09-24 01:30:42

-1

Podstawowa idea rozwiązania "highLight" jest w porządku, ale prawdopodobnie chcemy ustawić "statyczny" styl obramowania (zdefiniowany w css) dla img o takich samych wymiarach jak ten określony w metodzie highLight, więc nie powoduje zmiany rozmiaru.

Ponadto wierzę, że jeśli zmienisz wywołanie na "highLight (this)", a funkcję def na "highLight (obj)", możesz pominąć wywołanie "document.getElementById()" (i specyfikacja atrybutu "id" dla "img"), o ile zamiast tego użyjesz "obj.style.border".

Prawdopodobnie trzeba również poprawnie przeliterować "highLight".

Źródło

2008-09-24 01:39:12

Co, dokładnie, próbujesz zrobić? Jeśli używasz XPCOM, prawdopodobnie piszesz aplikację lub rozszerzenie dla jednego; nie możesz po prostu uzyskać danych obrazu i umieścić go bezpośrednio w schowku?

Źródło

2008-09-24 01:42:51 Eevee

Próbuję skopiować obraz do schowka, ale jest to zaskakująco trudne do zrobienia od XUL/JS/XPCOM. Proszę zobaczyć http://stackoverflow.com/questions/68103/how-do-i-copy-image-data-to-the-clipboard-in-my-xul-application jeśli wiesz jak! –

Mój osobisty wybór do wyboru elementów jest jquery:

Następnie, aby uzyskać element wyboru jest:.

$ ("# YOURIMAGEHERE img") koncentrują();

Źródło

2008-09-24 01:46:28 KevDog

Możesz również chcieć wywołać s.removeAllRanges() przed s.addRange (r).

Źródło

2009-10-09 19:41:10 Neil

Jak można wybrać element <img> programowo za pomocą JavaScript?

Odpowiedz

Powiązane problemy