2017-01-27 1 views
0

Derzeit versuche ich ein Bild zu ändern, auf ein anderes Bild klicken. Ich habe so mit dem folgenden Code zu tun verwaltet: (Arbeits)korrekt Bild src (Bild ein neues src geben)

<img id="inv1imgid" src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a2/X_mark.svg/525px-X_mark.svg.png" onclick="switchImage(this)" width="36" height="36" /> 
    var preselected = "https://upload.wikimedia.org/wikipedia/commons/thumb/a/a2/X_mark.svg/525px-X_mark.svg.png"; 
var selected = "https://cdn.pixabay.com/photo/2016/03/31/14/37/check-mark-1292787_960_720.png"; 

var switchImage = function(image) { 
    if(image.src == preselected) { 
     image.src = selected; 
    } else { 
     image.src = preselected; 
    } 
}; 

Diese Arbeit, aber nur, wenn ich gebe die img src eine URL. Ich möchte verwenden: src = "selectedimg.png" und src = "preselectedimg.png", aber wenn ich das tue, scheint es nicht das Bild zu finden, da kein Bild umgeschaltet wird. Ja, die Bilder haben diese Namen in meinem wwwroot-Ordner.

+0

Sie Bilder müssen den gleichen Pfad mit der Datei aufrufen, wenn Sie es so wollen – Roljhon

+1

Mögliche Duplikate von [Javascript dynamisch ändern den Speicherort des Bildes src - NO JQuery] (http: // stackoverflow.com/questions/11930079/javascript-dynamical-change-the-location-of-image-src-no-jquery) –

Antwort

1

Wenn diese Seite in einem Ordner auf root ist, wird der Pfad es sei denn Sie

img.src = '/selectedimg.png' 

zum Beispiel ...

Sie setzen auch die Basis verwenden, um das aktuelle Verzeichnis relativ sein uRL der aktuellen Seite durch den <base> hTML-Tag wie so

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>This is an example for the <base> element</title> 
     <base href="http://www.example.com/news/index.html"> 
    </head> 
    <body> 
     <p>Visit the <a href="archives.html">archives</a>.</p> 
    </body> 
</html> 

EDIT:

Schauen Sie auch Defining root of HTML in a folder within the site root folder

+0

Stellt sich heraus, was ich brauchte, war es für: 'Zeige meine ganze Seite url/+ selectedimg.png " –

0

Nehmen wir an, Sie haben zwei Bilder.

Sie möchten auf img2 klicken und ändern img1, von dem, was ich verstehe. Also, was Sie brauchen, ist dieser kleine Zusatz in img2 tag:

<img src="image2.jpg" id="img2" 
onclick="document.getElementById('img1').src = 'image3.jpg'" /> 

Das ist es. Ich hoffe, es ist hilfreich :)