Getting rid of the onclick when clicked with jQuery

ok so i have some select tags of cities

  <select onchange="storeCity(this.value, false)" name="search[city]" id="search_city" class="left">
  <option value="">== Select City ==</option>
  <optgroup label="Florida"><option selected="selected" value="ft-myers-s开发者_Python百科arasota-fl">Ft. Myers / Sarasota </option>
  <option value="jacksonville-fl">Jacksonville</option>
  <option value="miami-fl">Miami / Ft. Lauderdale </option>
  <option value="orlando-fl">Orlando</option>
  <option value="tampa-fl">Tampa</option></optgroup></select>

Some cities are not available now so i needed a lightbox to popup when they are clicked...which i have working with this code

  $('#search_city').change(function(e) {
   e.preventDefault();
   if ($(this).val() == 'jacksonville-fl' || $(this).val() == 'miami-fl' || $(this).val() == 'tampa-fl' || $(this).val() == 'ft-myers-sarasota-fl') {

}

The problem I have is that it goes to the link anyways and i need it to get rid of the link or the onchange on the select...something is getting the page to refresh...but i dont know what

storeCity(this.value, false) might have caused the refresh

BTW, you can merge the code like this:

$('#search_city').change(function(e) {
   storeCity(this.value, false);  
   if (this.value.match(/(jacksonville-fl|miami-fl|tampa-fl|ft-myers-sarasota-fl)/i)) {
      //do some stuff
   }
   e.preventDefault();
});

You could probably use jQuery's .one() function for this. E.g.

$('#search_city').one('change', function() {
  /* Your code */
});

The change event will only execute once.

you have a method called

storeCity(this.value, false) 

on change event , this might be refreshing the page. check that out.

Also a word of warning - I'd not use e.preventDefault() on a CHANGE event (unless you really need to), as it can have some weird behaviour in some browsers. Usually that's just for CLICK events.