Change href value using jQuery

by

Given you have unique href values (?what=parks, and ?what=malls) I would suggest not writing a path into the $.attr() method; you would have to have one call to $.attr() for each unique href, and that would grow to be very redundant, very quickly – not to mention difficult to manage.

Below I’m making one call to $.attr() and using a function to replace only the &city= portion with the new city. The good thing about this method is that these 5 lines of code can update hundreds of links without destroying the rest of the href values on each link.

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

One thing you may want to watch out for would be spaces, and casing. You could convert everything to lower case using the .toLowerCase() JavaScript method, and you can replace the spaces with another call to .replace() as I’ve down below:

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

Online Demo: http://jsbin.com/ohejez/

More Related Contents:

  1. jQuery .animate function not responding properly
  2. Why jQuery .load() is not working? [closed]
  3. What does [object Object] mean?
  4. Assign click handlers in for loop
  5. Scroll Automatically to the Bottom of the Page
  6. Reload an iframe with jQuery
  7. jQuery click not working for dynamically created items [duplicate]
  8. Stop setInterval
  9. Finding line-wraps
  10. Determine Pixel Length of String in Javascript/jQuery?
  11. Add st, nd, rd and th (ordinal) suffix to a number
  12. How to build simple jQuery image slider with sliding or opacity effect?
  13. How to detect browser back button click event using angular?
  14. Using jQuery to compare two arrays of Javascript objects
  15. How to check if the URL contains a given string?
  16. keycode and charcode
  17. Copy a variable’s value into another
  18. jQGrid Column Chooser Modal Overlay
  19. Bootstrap 4: Uncaught ReferenceError: Popper is not defined
  20. Find all the days in a month with Date object?
  21. Best way to validate date string format via jQuery
  22. Consider marking event handler as ‘passive’ to make the page more responsive
  23. DOM Mutation event in JQuery or vanilla Javascript
  24. How to change URL in browser without navigating away from page?
  25. Get age from Birthdate [duplicate]
  26. How to get 30 days prior to current date?
  27. Uncaught TypeError: Cannot read property ‘msie’ of undefined [duplicate]
  28. JQuery .hasClass for multiple values in an if statement
  29. Unloading/Removing content from an iFrame
  30. How should I crop an image at client side using jcrop and upload it?

Leave a Comment