Javascript 无法单击锚定链接_Javascript_Jquery_Html_Anchor_Masonry

Javascript 无法单击锚定链接

javascript jquery html

Javascript 无法单击锚定链接,javascript,jquery,html,anchor,masonry,Javascript,Jquery,Html,Anchor,Masonry,我正在我的新网站上工作，有一个砖石/Pinterest风格的效果博客板。当你将鼠标悬停在一篇文章上时，它会弹出一个按钮，链接到博客/单个页面。如果您右键单击并在新窗口中打开，它将执行此操作，但如果您只是左键单击，则不会执行此操作我猜这与我用来支持砖石风格的javascript有关试验现场位于：如果有人能帮忙，那就太好了问候以下是我的html代码供参考： <!DOCTYPE html> <html> <head> <title>Lee B

我正在我的新网站上工作，有一个砖石/Pinterest风格的效果博客板。当你将鼠标悬停在一篇文章上时，它会弹出一个按钮，链接到博客/单个页面。如果您右键单击并在新窗口中打开，它将执行此操作，但如果您只是左键单击，则不会执行此操作

我猜这与我用来支持砖石风格的javascript有关

试验现场位于：

如果有人能帮忙，那就太好了

问候

以下是我的html代码供参考：

<!DOCTYPE html>
<html>
<head>

<title>Lee Bollu - Creative Designer Leigh-on-Sea, Essex</title>

<link rel="stylesheet" type="text/css" href="css/styles.css">
<link rel="stylesheet" type="text/css" href="css/columns.css">
<link rel="stylesheet" type="text/css" href="css/flexy-menu.css">

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>
<body>

<!--Header-->

    <div class="nav-wrapper">

        <div class="nav-inner">

            <a href="index.html"><img class="logo" src="images/lee-bollu-logo.svg" alt="Lee Bollu Logo"></a>

            <a href="http://www.facebook.com/lee.bollu"><img class="social" src="images/facebook.svg" alt="facebook"></a>
            <a href="http://www.twitter.com/lbollu"><img class="social" src="images/twitter.svg" alt="twitter"></a>

            <ul class="flexy-menu">
                <li><a href="index.html">Work</a></li>
                <li><a href="blog.html">Blog</a></li>
            </ul>

        </div>
    </div>

<!--Header-->

<!--Recent Blog Posts-->

    <div class="container">
        <div class="container-fluid social-wrapper">
      <div id="social-container"></div>

      <div id="hidden-items">

        <!-- start of an item-->
        <div class="item panel clearfix social-entry">
          <div class="panel-body">
            <div class="content-image">
              <img height="300" src="images/workitem.jpg">

                <div class="social-blog">
                    <span>
                        <a href="single.html">VIEW POST</a>
                    </span>
                </div>

            </div>
            <div class="doing-intro">
                <h4>Post One</h4>
                <p>Mus molorpor sam, nustintende eum quo blant vellore, quibus maximodi offic tet, ad que et excepudae sed</p>
                <h5><a href="#">Design</a>, <a href="#">Web</a> &#160;&#160;|&#160;&#160; 2nd July 2014</h5>
            </div>
          </div>
        </div>
        <!-- end of an item-->

        <!-- start of an item-->
        <div class="item panel clearfix social-entry">
          <div class="panel-body">
            <div class="content-image">
              <img height="700" src="images/workitem.jpg">

                <div class="social-blog">
                    <span>
                        <a href="single.html">VIEW POST</a>
                    </span>
                </div>

            </div>
            <div class="doing-intro">
                <h4>Post One</h4>
                <p>Mus molorpor sam, nustintende eum quo blant vellore, quibus maximodi offic tet, ad que et excepudae sed</p>
                <h5><a href="#">Design</a>, <a href="#">Web</a> &#160;&#160;|&#160;&#160; 2nd July 2014</h5>
            </div>
          </div>
        </div>
        <!-- end of an item-->

        <!-- start of an item-->
        <div class="item panel clearfix social-entry">
          <div class="panel-body">
            <div class="content-image">
              <img height="200" src="images/workitem.jpg">

                <div class="social-blog">
                    <span>
                        <a href="single.html">VIEW POST</a>
                    </span>
                </div>

            </div>
            <div class="doing-intro">
                <h4>Post One</h4>
                <p> Mus molorpor sam, nustintende eum quo blant vellore, quibus maximodi offic tet, ad que et excepudae sed Mus molorpor sam, nustintende eum quo blant vellore, quibus maximodi offic tet, ad que et excepudae sed</p>
                <h5><a href="#">Design</a>, <a href="#">Web</a> &#160;&#160;|&#160;&#160; 2nd July 2014</h5>
            </div>
          </div>
        </div>
        <!-- end of an item-->

        <!-- start of an item-->
        <div class="item panel clearfix social-entry">
          <div class="panel-body">
            <div class="content-image">
              <img height="200" src="images/workitem.jpg">

                <div class="social-blog">
                    <span>
                        <a href="single.html">VIEW POST</a>
                    </span>
                </div>

            </div>
            <div class="doing-intro">
                <h4>Post One</h4>
                <p>Mus molorpor sam, nustintende eum quo blant vellore, quibus maximodi offic tet, ad que et excepudae sed</p>
                <h5><a href="#">Design</a>, <a href="#">Web</a> &#160;&#160;|&#160;&#160; 2nd July 2014</h5>
            </div>
          </div>
        </div>
        <!-- end of an item-->

        <!-- start of an item-->
        <div class="item panel clearfix social-entry">
          <div class="panel-body">
            <div class="content-image">
              <img height="180" src="images/workitem.jpg">

                <div class="social-blog">
                    <span>
                        <a href="single.html">VIEW POST</a>
                    </span>
                </div>

            </div>
            <div class="doing-intro">
                <h4>Post One</h4>
                <p>Mus molorpor sam, nustintende eum quo blant vellore, quibus maximodi offic tet, ad que et excepudae sed Mus molorpor sam, nustintende eum quo blant vellore, quibus maximodi offic tet, ad que et excepudae sed</p>
                <h5><a href="#">Design</a>, <a href="#">Web</a> &#160;&#160;|&#160;&#160; 2nd July 2014</h5>
            </div>
          </div>
        </div>
        <!-- end of an item-->

      </div>
    </div>
    </div>

<!--Contact Info-->
    <div class="lightgrey-wrapper">
        <div class="container">

            <div class="contact-wrapper">
                <div class="contact-option">
                    <img class="contact-image" src="images/phone.svg" alt="Lee Bollu Creative Designer Contact">
                    <h4>Phone</h4>
                    <p>07769 338 649</p>
                </div>
                <div class="contact-option">
                    <img class="contact-image" src="images/computer.svg" alt="Lee Bollu Creative Designer Computer">
                    <h4>Email</h4>
                    <p>hello@leebollu.co.uk</p>
                </div>
            </div>

        </div>
    </div>
<!--Contact Info-->

<!--base-->
    <div class="base-wrapper">
        <div class="container">
            <div class="section group">

                <div class="col span_12_of_12">
                    <p>&copy; 2014 Lee Bollu</p>

                    <a href=""><img class="base-social" src="images/foot-in.svg" alt=""></a>
                    <a href=""><img class="base-social" src="images/foot-drib.svg" alt=""></a>
                    <a href=""><img class="base-social" src="images/foot-fb.svg" alt=""></a>
                    <a href=""><img class="base-social" src="images/foot-twit.svg" alt=""></a>

                </div>
        </div>
    </div>
<!--base-->


        <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
        <script type="text/javascript" src="js/flexy-menu.js"></script>
        <script>
            $(document).ready(function(){
                $(".panel a").click(function(e){
                    e.preventDefault();
                    var style = $(this).attr("class");
                    var menustyle = $(".flexy-menu").attr("class");
                    if(menustyle.indexOf("light") > -1){
                        $(".flexy-menu").removeAttr("class").addClass("flexy-menu light").addClass(style);
                    }
                    else{
                        $(".flexy-menu").removeAttr("class").addClass("flexy-menu").addClass(style);
                    }
                });
            });

            $(document).ready(function(){  
                $(".flexy-menu").flexymenu({
                    speed: 400,
                    type: "horizontal",
                    align: "left",
                    indicator: false
                });
            });
        </script>
        <script src="https://cdn.jsdelivr.net/isotope/2.0.0/isotope.pkgd.min.js"></script>
    <script src="js/blog-feed.js"></script>
</body>
</html>


Lee Bollu-创意设计师Leigh on Sea，埃塞克斯




张贴一
穆斯莫洛普·萨姆、努斯廷登德·尤姆·布朗特·维洛尔、奎布斯·马克西莫迪办公室，以及其他地方
,    |   2014年7月2日
张贴一
穆斯莫洛普·萨姆、努斯廷登德·尤姆·布朗特·维洛尔、奎布斯·马克西莫迪办公室，以及其他地方
,    |   2014年7月2日
张贴一
穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯
,    |   2014年7月2日
张贴一
穆斯莫洛普·萨姆、努斯廷登德·尤姆·布朗特·维洛尔、奎布斯·马克西莫迪办公室，以及其他地方
,    |   2014年7月2日
张贴一
穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯穆斯
,    |   2014年7月2日
电话
07769338649
电子邮件
hello@leebollu.co.uk
&抄袭；2014年李博鲁
$（文档）.ready（函数（）{
$（“.panel a”）。单击（函数（e）{
e、 预防默认值（）；
var style=$（this.attr（“类”）；
var menustyle=$（“.flexy menu”）.attr（“类”）；
if（menustyle.indexOf（“light”）>-1）{
$（.flexy menu”）.removeAttr（“class”）.addClass（“flexy menu light”）.addClass（样式）；
}
否则{
$（.flexy menu”）.removeAttr（“类”）.addClass（“flexy menu”）.addClass（样式）；
}
});
});
$（文档）.ready（函数（）{
$（“.flexy菜单”）.flexymenu({
速度:400,，
类型：“水平”，
对齐：“左”，
指标：假
});
});

李

这是你的问题：

$(document).ready(function(){
    $(".panel a").click(function(e){
        e.preventDefault();
        var style = $(this).attr("class");
        var menustyle = $(".flexy-menu").attr("class");
        if(menustyle.indexOf("light") > -1){
            $(".flexy-menu").removeAttr("class").addClass("flexy-menu light").addClass(style);
        }
        else{
            $(".flexy-menu").removeAttr("class").addClass("flexy-menu").addClass(style);
        }
    });
});

这将捕获“.panel a”中的所有链接并阻止默认行为。

您需要删除

e.preventDefault（）在$（“.panel a”）。单击（）
请在这里发布相关代码，而不仅仅是链接到一个实时站点。当您解决问题时，链接将不再与问题相关。非常感谢！请客：）嗨@user2536994！如果这个或任何答案已经解决了你的问题，请考虑通过点击复选标记接受它。这向更广泛的社区表明，你已经找到了一个解决方案，并给回答者和你自己带来了一些声誉。没有义务这样做。
        $(document).ready(function(){
            $(".panel a").click(function(e){
                e.preventDefault();
                var style = $(this).attr("class");
                var menustyle = $(".flexy-menu").attr("class");
                if(menustyle.indexOf("light") > -1){
                    $(".flexy-menu").removeAttr("class").addClass("flexy-menu light").addClass(style);
                }
                else{
                    $(".flexy-menu").removeAttr("class").addClass("flexy-menu").addClass(style);
                }
            });
        });