Changer la valeur de href en utilisant jQuery

Comment réécrire une valeur href à l’aide de jQuery?

J’ai des liens avec une ville par défaut

parks malls

Si l’utilisateur entre une valeur dans une zone de texte #city, je souhaite remplacer Paris par la valeur entrée par l’utilisateur.

Jusqu’ici j’ai

 var newCity = $("#city").val();

Étant donné que vous avez des valeurs href uniques ( ?what=parks , et ?what=malls ), je suggérerais de ne pas écrire de chemin dans la $.attr() ; vous auriez besoin d’un appel à $.attr() pour chaque href unique, et cela deviendrait très redondant, très rapidement – sans parler de la difficulté à gérer.

Ci-dessous, j’appelle $.attr() et utilise une fonction pour remplacer uniquement la partie &city= par la nouvelle ville. La bonne chose à propos de cette méthode est que ces 5 lignes de code peuvent mettre à jour des centaines de liens sans détruire le rest des valeurs href sur chaque lien.

 $("#city").change(function(o){ $("a.malls").attr('href', function(i,a){ return a.replace( /(city=)[az]+/ig, '$1'+o.target.value ); }); });

Il y a une chose à surveiller: les espaces et le boîtier. Vous pouvez tout convertir en minuscules à l’aide de la méthode JavaScript .toLowerCase() et remplacer les espaces par un autre appel à .replace() comme indiqué ci-dessous:

 '$1'+o.target.value.replace(/\s+/, '');

Démo en ligne: http://jsbin.com/ohejez/

  $('a').attr("href", "/search/?what=parks&city=" + newCity);

Dès qu’une clé est relâchée dans le #city saisie #city , la href sera mise à jour.

 $('#city').keyup(function(){ $('a').attr('href','/search/?what=parks&city='+$(this).val()); });

Comme ça:

 var newCity = $("#city").val(); $('a').attr('href', '/search/?what=parks&city=' + newCity);

EDIT: Ajout de la chaîne de recherche