Anchor Tag表现得很奇怪

时间:2016-06-08 12:02:35

标签: jquery html css anchor

我的锚标签不起作用,理想的网址是localhost / VShroff / home / about.php,但网址更改为localhost / about.php,也不会重定向。很长一段时间以来,我一直在努力克服这个问题。

以下是HTML:

<html>
  <head>
    <meta name="generator"
    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
    <title></title>
  </head>
  <body>
    <div class="row" style="margin:10px;">
      <div id="blocka" class="column col-md-6" style="padding:20px;width:150px;height:150px;background-color:#DA0A82">
        <ul>
          <li>
            <a style="font-family:perpetua;font-size:16px;color:white;" href="about.php">About</a>
          </li>
          <li id="family" class="family" style="font-family:perpetua;font-size:16px;color:white;">Family</li>
          <li id="ent" class="ent" style="font-family:perpetua;font-size:16px;color:white;">Enterprise</li>
          <li style="font-family:perpetua;font-size:16px;color:white;">News &amp; Media</li>
          <li style="font-family:perpetua;font-size:16px;color:white;">Resources</li>
        </ul>
      </div>
      <div id="familyNav" class="familyNav column col-md-6"
      style="margin-left:10px;padding:20px;width:150px;height:150px;background-color:#7D0651">
        <ul>
          <li style="font-family:perpetua;font-size:16px;color:white;">Timeline</li>
          <li style="font-family:perpetua;font-size:16px;color:white;">Tree</li>
          <li style="font-family:perpetua;font-size:16px;color:white;">Biographies</li>
        </ul>
      </div>
      <div id="enterprise" class="enterprise column col-md-6"
      style="margin-left:10px;padding:20px;width:150px;height:150px;background-color:#7D0651">
        <ul>
          <li style="font-family:perpetua;font-size:16px;color:white;">Parimal K. Shroff &amp; Co.</li>
          <li style="font-family:perpetua;font-size:16px;color:white;">Sunways Group</li>
          <li style="font-family:perpetua;font-size:16px;color:white;">Organograms</li>
          <li style="font-family:perpetua;font-size:16px;color:white;">The Shroffice</li>
        </ul>
      </div>
    </div>
  </body>
</html>

我使用以下Jquery和CSS:

<script>
$('.family').click(function () {
    $('#enterprise').hide(); 
    $('#familyNav').slideToggle('2000',"swing", function () {
        // Animation complete.
    });
});
$('.ent').click(function () {
    $('#familyNav').hide(); 
    $('#enterprise').slideToggle('2000',"swing", function () {
        // Animation complete.
    });
});
</script>

<style>
#blocka {
    z-index: 100;
}
#familyNav {
    display:none;
}
#family {
    cursor:pointer;
}
#enterprise {
    display: none;
}
#ent {
    cursor: pointer;
}
</style>

编辑:当我将鼠标悬停在链接上时,它显示正确的URL(localhost / directories / about.php)但是当我点击它时没有任何反应,但浏览器URL更改为localhost / about.php(页面未重定向到localhost / about.php)

5 个答案:

答案 0 :(得分:0)

我假设您的目录结构为

htdocs or www (BASED ON YOUR SERVER)
|
|--Vshroff
      |--NEW
          |--home
             |
             |-index.php(HERE IS THE ANCHOR TAG)
             |-about.php

所以我在我的机器上创建了相同的结构。 这是文件

的index.php

<?php
echo '<a href="about.php">about</a>';
?>

about.php

<?php
echo '<a href="index.php">index</a>';
?>

它完美无缺。

答案 1 :(得分:0)

如果您在www目录中有此HTML,则会重定向到localhost/about.php。如果它出现在www/shroff/home/中,那么它会相对重定向到localhsot/shroff/home/about.php

答案 2 :(得分:0)

为什么不使用相对路径,如:&#34; ./ about.php&#34;如果您的about页面与索引位于同一文件夹中??

答案 3 :(得分:0)

试试这可能有用......

<?php
    $root='http://'.$_SERVER['HTTP_HOST'].str_replace(basename($_SERVER['SCRIPT_NAME']), '', $_SERVER['SCRIPT_NAME']);
?>
<a href="<?php echo $root;?>/about.php">About</a>

答案 4 :(得分:0)

JQuery文件导致此错误,无法改进并找出问题所在,但是在删除它正常工作的jquery文件时。

我想我可以不用那个文件。

谢谢大家。