Ersetzen Abschnitt von href mit jQuery

Question

Ich habe nach einer Antwort gesucht, aber nichts gefunden, die meine besondere Situation passt.

Eine abgespeckte Beispiel dafür, was ich arbeite sind hier zu finden: http://jsbin.com/qujojuriri/1/edit?html,js,output

So baue ich eine Fotogalerie, die eine Flickr JSON-Feed verwendet, um Bilder von meinem Konto abzurufen, so dass, um Aktualisieren Sie die Galerie auf meiner Website Ich muss nur das Bild mit einem bestimmten Tag auf Flickr hochladen.

$(document).ready(function() { 
    $.getJSON(
     "http://api.flickr.com/services/feeds/photos_public.gne?id=125573694@N07&lang=en-us&format=json&jsoncallback=?", { 
     tags: "favorite" 
     }, function(data) { 
      $.each(data.items, function(i, item) { 
       $("<img/>").addClass("class").attr("src", item.media.m).appendTo(
       "#favgallery").wrap(
       "<a href='"+ item.media.m +"' target='_blank'><img src='"+ item.media.m +"'>" 
       ); 
      }); 
    }); 
}); 

//JSON Feed: http://api.flickr.com/services/feeds/photos_public.gne?id=125573694@N07&lang=en-us&format=json&jsoncallback=? 

Flickr adds a special suffix to the end of each image URL to determine the photo quality. Beispiel: Eine Bild-URL mit dem Suffix "_m" ist kleiner als die gleiche URL mit dem Suffix "_c".

Ich möchte die Miniaturbilder für meine Galerie mit einer Qualität anzeigen lassen, aber wenn ich dann auf diese Miniaturansicht klicke, öffnet sich ein neuer Tab mit einer höheren Version des Bildes. Mein Problem ist, dass mit dem JSON-Feed (Link befindet sich am unteren Ende des Codeausschnitts) nur der Link zum Suffix "m" bereitgestellt wird. Ich bin nicht daran interessiert, den Inhalt des JSON-Feeds so zu ändern, dass er andere Suffixe enthält, sondern mithilfe von jQuery die URL anzupassen, die ich erhalte, um das Suffix "_m" durch das Suffix "_c" zu ersetzen.

Ich habe versucht, den folgenden Code nach meinem ersten jQuery hinzufügen, um dies zu tun, aber es tut nichts.

$('a').each(function(){ 
    this.href = this.href.replace('_m', '_c'); 
}); 

Fassen wir zusammen: Gerade jetzt, wenn ich auf die Bilder klicken ich aus dem JSON-Feed abgerufen haben, ist es die URL mit „_M“ Suffix öffnet, und ich möchte jQuery verwenden, das zu ändern "_c". Vielen Dank!

P.S. Ich habe nur ein grundlegendes Wissen über jQuery, also würde ich es lieben, wenn du gründliche Antworten liefern könntest oder vielleicht sogar den oben angegebenen jsbin Link mit dem korrigierten Code bearbeitest. Vielen Dank!

Answer 1

Sie können einfach die _m ersetzen, bevor Sie dem Bild den Link zuweisen. Dein Code sieht gut aus Ich habe gerade eine Zeile hinzugefügt.

// use different link for a tags 
var imageLink = item.media.m.replace('_m', '_c'); 

// update div with images 
$("<img/>").addClass("class").attr("src", item.media.m).appendTo("#favgallery").wrap("<a href='" + imageLink + "' target='_blank'>"); 

Entfernen Sie auch die <img src='"+ item.media.m +"'>, da es redundant ist.

Demo:

$(document).ready(function() { 
 
    $.getJSON(
 
    "https://api.flickr.com/services/feeds/photos_public.gne?id=125573694@N07&lang=en-us&format=json&jsoncallback=?", { 
 
     tags: "favorite" 
 
    }, 
 
    function(data) { 
 
     $.each(data.items, function(i, item) { 
 

 
     // use different link for a tags 
 
     var imageLink = item.media.m.replace('_m', '_c'); 
 

 
     // update div with images 
 
     $("<img/>").addClass("class").attr("src", item.media.m).appendTo("#favgallery").wrap("<a href='" + imageLink + "' target='_blank'>"); 
 
     }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="favgallery"></div>