【问题标题】:Href does not workHref 不起作用
【发布时间】:2015-12-13 03:53:16
【问题描述】:

希望有人可以帮助我解决这个问题。以下菜单项(Get on Amazon 等)更改了浏览器中页面上的信息,但第一个菜单应将实际页面更改为我的索引页面。由于某种原因,我无法让它工作

<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--  >
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
    <meta charset="utf-8">
    <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><![endif]-->
    <title>Painful Words Dot Com</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
<!-- 

痛苦的话语 -->

    <!-- Google Web Font Embed -->
    <link href='http://fonts.googleapis.com/css?family=Raleway:400,600,500,300,700' rel='stylesheet' type='text/css'>

    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/painful_main.css">
</head>
<body>
    <div id="main-wrapper">
        <!--[if lt IE 7]>
            <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a rel="nofollow" href="http://browsehappy.com">upgrade your raasclaat browser</a> or <a rel="nofollow" href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
        <![endif]-->

        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 affix text-center" style="z-index: 1;">
            <h1 class="painful-site-title">
                    <a href="#">Painful Words</a>
                    <img src="images/btn-menu.png" alt="main menu" id="m-btn" class="pull-right visible-xs visible-sm" >
            </h1>

            <ul id="responsive" style="display:none" class="hidden-lg hidden-md"></ul><!-- /.responsive -->
        </div>

        <div class="menu visible-md visible-lg">
            <ul id="menu-list">
                <li class="active back-menu"><a href="http://www.painfulwords.com">Go Back</a></li>
                <li class="inactive purchase-menu"><a href="#purchase">Purchase</a></li>
                <li class="amazon-menu"><a href="#amazon">Get on Amazon</a></li>
                <li class="google-menu"><a href="#google">Get on Google Play</a></li>
                <li class="noble-menu"><a href="#noble">Get on Barnes & Noble</a></li>








            </ul>
        </div><!-- /.menu -->

        <div class="image-section">
            <div class="image-container">
                <img src="images/gone.jpg" id="purchase-img" class="main-img inactive" alt="purchase">
                <img src="images/love.jpe" id="amazon-img" class="inactive" alt="amazon">
                <img src="images/fam.jpe" id="google-img" class="inactive" alt="google">
                <img src="images/fam2.jpe" id="noble-img"  class="inactive" alt="noble">

【问题讨论】:

  • 哪个“第一个菜单”? &lt;li class="active back-menu"&gt;&lt;a href="http://www.painfulwords.com"&gt;Go Back&lt;/a&gt;&lt;/li&gt;?看起来不错,所以很可能是别的东西。将我们链接到一个实际示例,以便我们查看。
  • 这正是那个不起作用的。后台菜单。它是唯一应该更改页面的。我也尝试将其更改为索引,但这不起作用。这是一个例子:painfulwords.com/purchase.html

标签: html href


【解决方案1】:

http://www.painfulwords.com/js/templatemo_script.js JavaScript 文件中的以下代码阻止了链接工作。

$("#menu-list a, #responsive a").on('click',function(e){
  if(this.className == "external") {
    return;
  }

  // THIS BIT HERE cancels the link's default action    
  e.preventDefault();

尝试为链接添加 external 的附加类。

【讨论】:

  • 哦。好的。甚至不知道你是怎么找到的,但谢谢。甚至不知道我有它。我能够找到它,但我离程序员还很远。我几乎没有编程和 HTML 经验。所以我不确定你说的给链接增加一个类是什么意思。
  • @PlattyBear &lt;a href="http://www.painfulwords.com"&gt;Go Back&lt;/a&gt;&lt;a href="http://www.painfulwords.com" class="external"&gt;Go Back&lt;/a&gt;
  • 是的,我也想通了。谢谢。确实有效
猜你喜欢
  • 2012-10-01
  • 1970-01-01
  • 1970-01-01
  • 2012-08-16
  • 2017-08-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多