Как игнорировать базовый href при использовании location.href = "#_ ElementId_"? - PullRequest
Новая
       4

Как игнорировать базовый href при использовании location.href = "#_ ElementId_"?

2 голосов
/ 07 апреля 2011

Если у веб-страницы есть базовая ссылка, есть ли возможность ее игнорировать, когда мы используем # ElementId , без обновления страницы?

Вот код: 

<html>
  <head>
    <base href="http://www.google.com/" />
  </head>
  <body>
    <div id="test">
      Test
    </div>
    <button onclick="location.href='#test'">Back to Test</button>
    <a href="#test">Back to Test!</a>
  </body>
</html>

Когда я нажимаю кнопку или ссылку, я хочу, чтобы браузер перевел страницу на тест div #. Без тега base href все работает - однако с тегом base-href я не могу сделать это без помощи Javascript. Есть ли способ сделать это более «естественным» способом?

Ниже представлен обходной путь, который у меня есть на данный момент ... 

<html>
  <head>
    <base href="http://www.google.com/" />
    <script type="text/javascript">
      function goToElement(elementId) {
        var baseTag = document.getElementsByTagName("base")[0];
        var existingBaseHref = baseTag.href;
        baseTag.href = "";
        location.href = "#" + elementId;
        baseTag.href = existingBaseHref;
      }
    </script>
  </head>
  <body>
    <div id="test">
      Test
    </div>
    <button onclick="goToElement('test')">Back to Test</button>
    <a onclick="goToElement('test')">Back to Test!</a>
  </body>
</html>

Ответы [ 3 ]

1 голос
/ 07 апреля 2011

Возможно, вам просто потребуется вывести полный абсолютный URL-адрес в атрибуте href вашей ссылки.

Например, вы можете сделать что-то подобное в ASP.NET (используя библиотеку AntiXss ): 

<a href="<%= AntiXss.HtmlAttributeEncode(Request.Url.AbsoluteUri) %>#test">
    Link text...
</a>

Или как-то так в PHP: 

<a href="<?php echo htmlentities($_SERVER['REQUEST_URI'], ENT_QUOTES, 'ISO-8859-1'); ?>#test">
    Link text...
</a>
0 голосов
/ 06 июня 2018

У меня была похожая проблема при использовании.Это было мое решение, которое работало на внутренних страницах, например, www.mozilla.org/about

<div>
  <a href="/about#target"></a>
  <p>Content...</p>
  <div id="target">
    Target Div
  </div>
</div>
0 голосов
/ 07 апреля 2011

При этом будет выполнен переход к элементу с id = "test", а возвращаемое значение false приведет к тому, что он останется на странице.

<a href="#test" onclick="document.getElementById('test').scrollIntoView(); return false">Go to div with id=test</a>

Кажется невозможнымделайте что хотите без использования скрипта или добавления полного пути к href на сервере

...