-1

我有一个商店定位器,每次单击锚点(例如 Zoom Here、Directions 或 Street View)时,href 中的哈希都会将我带到页面顶部。我怎样才能防止这种情况发生?我尝试查看 Store Locator 源,但它被缩小并且很难弄清楚是什么。我还尝试使用类“动作”将事件委托添加到锚点,但这也不起作用。

主功能

google.maps.event.addDomListener(window, 'load', function() {
    var map = new google.maps.Map(document.getElementById('mappanel'), {
        center: new google.maps.LatLng(56.102683, 10.452576),
        zoom: 7,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var panelDiv = document.getElementById('searchpanel');
    var data = new storeSource;
    var view = new storeLocator.View(map, data, {
        geolocation: false
    });
    new storeLocator.Panel(panelDiv, {
        view: view
    });
});

storeLocator 类

/** @extends storeLocator.StaticDataFeed */
function storeSource() {
  jQuery.extend(this, new storeLocator.StaticDataFeed);
  var that = this;
  jQuery.get('/components/com_maps/storeSource.csv', function(data) {
     that.setStores(that.parse_(data));
  });
}

/** @private */
storeSource.prototype.parse_ = function(csv) {
  var stores = [];
  var rows = csv.split('\r');
  var headings = this.parseRow_(rows[0]);
  for (var i = 1, row; row = rows[i]; i++) {
    row = this.toObject_(headings, this.parseRow_(row));
    if(row.adresse.length > 3) {
      row.lat = row.lat.replace(",", ".");
      row.lng = row.lng.replace(",", ".");
      var position = new google.maps.LatLng(row.lat, row.lng);
      var locality = this.join_([row.postnr, row.by], ', ');
      var store = new storeLocator.Store(row.uid, position, null, {
        title: row.navn,
        address: this.join_([row.adresse, locality, row.land], '<br>'),
        phone: row.tlfnr
      });
      stores.push(store);
    }
  }
  return stores;
};
/** Joins elements of an array that are non-empty and non-null. */
storeSource.prototype.join_ = function(arr, sep) {
  var parts = [];
  for (var i = 0, ii = arr.length; i < ii; i++) {
    arr[i] && parts.push(arr[i]);
  }
  return parts.join(sep);
};
/*** CSV parsing */
storeSource.prototype.parseRow_ = function(row) {
  // Each row in the CSV file only has ; as delimiter
  row = row.split(';');
  return row;
};
/** Creates an object mapping headings to row elements. */
storeSource.prototype.toObject_ = function(headings, row) {
  var result = {};
  for (var i = 0, ii = row.length; i < ii; i++) {
    result[headings[i]] = row[i];
  }
  return result;
};

这是 Store Locator 库的链接: http: //storelocator.googlecode.com/git/index.html

4

1 回答 1

0

这是浏览器中单击值为 的<a>标签的默认行为。保留用于跳转到页面上的部分。举个简单的例子,如果你有一个带有of的标签,并且你的页面上有一个属性也是的部分,那么点击会将用户直接带到你页面的部分。如果您只是有,那么浏览器会跳到页面的最顶部,因为您没有指定部分名称。href##<a>href#moviesnamemovies<a href="#movies">movies#

为了防止这种行为,您至少需要这样做:

$(".my-links").on( 'click', function( evt ) {
    evt.preventDefault();
});

而且您可能还需要包括另一行这样的(取决于您的选择器/设置):

$(".my-links").on( 'click', function( evt ) {
    evt.preventDefault();
    evt.stopPropagation();
});

preventDefault()将停止单击与选择器匹配的任何元素的默认行为。见这里

stopPropagation()将阻止默认事件冒泡 DOM,因此它不会被任何父元素捕获。见这里

希望这可以帮助

于 2013-09-26T16:06:50.390 回答