href=# вызывает изменение адреса местоположения, можем ли мы этого избежать?

У меня есть несколько вкладок, которые я обрабатываю специальной логикой, поэтому изменение адреса адресной строки не должно происходить. у меня есть следующее

<a href="#">Home</a>

Это ведет себя так, как ожидалось, то есть дает мне указатель мыши при наведении курсора на кнопки, но при нажатии на них начинается изменение маршрута. Я хочу быть в состоянии остановить это.

Я попытался просто удалить href или установить href="", похоже, это имело некоторый успех, но при наведении курсора это дало неожиданные результаты.

Какова лучшая практика здесь? Должен ли я удалить href? Итак, мне нужно будет стилизовать вкладку с помощью CSS, чтобы дать мне указатель мыши при наведении курсора? Если я оставлю href="#" в ссылке, это вызовет изменение маршрутизации, а это не то, что я искал.

На самом деле я обрабатываю свой логин в ngClick для каждой вкладки. Эта логика не должна изменять маршрут.

Любые идеи?


angularjs angularjs-routing
person Martin    schedule 06.08.2013    source источник

Ответы (3)


arrow_upward
7
arrow_downward

Попробуйте сделать:

<a href="javascript:void(0);">Home</a>
person AlwaysALearner    schedule 06.08.2013
comment
Спасибо, а это не смешение js с html, я хотел уйти от этого... Хотя если по-другому нельзя?? - person Martin; 06.08.2013
comment
Если вы хотите сохранить свою логику, вам нужно смешать немного js с html. Другой вариант, как вы уже упоминали, — это удалить атрибут href и применить стиль курсора: указатель к вашему элементу. - person AlwaysALearner; 06.08.2013
comment
Просто предупреждение: Angular — это фреймворк, который сильно зависит от расширения синтаксиса HTML, поэтому я не думаю, что вы сможете избежать смешивания Javascript (или выражений Angular) с HTML. И я думаю, что это совершенно нормально при использовании такого рода фреймворков. Этот вопрос дает больше информации по этому вопросу. - person Michael Benford; 06.08.2013
comment
Спасибо, это решило мою проблему. И здесь тоже согласен с Михаилом. - person Martin; 07.08.2013

arrow_upward
3
arrow_downward

Если вы не используете тег <base>, вы можете просто использовать:

<a href="">Home</a>

Действительно, согласно документации:

[...] действие по умолчанию запрещено, когда атрибут href пуст.

Ну, документация неверна, и реальное поведение на самом деле состоит в том, чтобы предотвратить действие по умолчанию, когда атрибут href равен местоположению страницы. Это проблема, когда вы используете <base>. В этом случае у вас есть два варианта:

  • Забудьте атрибут href. Это прекрасно работает, но ваша страница больше не будет действительна, так как атрибут href является обязательным для тега <a>.
  • Создайте свою собственную директиву, например aEmpty, целью которой будет просто заполнить атрибут href реального <a> текущим значением $location.path().

Во всех случаях лучше использовать CSS для стилизации ссылки, потому что полагаться на поведение браузеров по умолчанию — плохая идея.

person Blackhole    schedule 06.08.2013

arrow_upward
1
arrow_downward

Замените href на ng_click.

Чтобы получить указатель мыши в виде руки, добавьте стиль css:

a { cursor: pointer ; }
a:hover   { color: #00c }  /* user hovers     */
person user2793135    schedule 05.12.2013