Jquery点击功能不起作用

时间:2011-09-27 17:59:30

标签: jquery

jQuery没有使用弹出式div。当我点击任何Click Me文本时,会显示弹出div。然后我点击onetwo,没有任何反应!?如果我点击onetwo应该会消失,反之亦然。

复制下面的代码并亲自尝试。解决方案是什么?

  <html>
    <head>
    <style type="text/css">
    .ratecontainer {
    display:block;
    float:left;
    height:40px;

    }
    .ratecontainer a {
    color:#FFFFFF;
    text-decoration:none;

    }

    .ratebutton1 {
    padding:5px;
    color:#FFFFFF;
    cursor:pointer;
    background-color:#59758d;
    }

    .ratebutton1:hover {
    background-color:#4a6f8e;

    }
    .ratebutton2 {
    padding:5px;
    color:#FFFFFF;
    cursor:pointer;
    background-color:#59758d;
    }

    .ratebutton2:hover {
    background-color:#4a6f8e;

    }

    #info {
    position:absolute;
    text-align:left;
    width:950px;
    height:auto;
    top:100px;
    left:50%;
    z-index:20;
    margin-left:-475px;

    border:1px solid #000000;
    background-color:#FFFFFF;
    display: none;


    }

    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    </head>

    <body>
    <script type="text/javascript">
    $(function() {

        $('.ratebutton1').click(function() {

            $('.ratebutton2').hide();

        });

        $('.ratebutton2').click(function() {

            $('.ratebutton1').hide();

        });

          $('.infobutton').click(function() {

var id = $(this).attr('id');
var row = '#box'+id;

$('#info').css('display','block');
var ninfo = $(row).html();
$('#info').html(ninfo);
});

    });



    </script>

     <div id="info"></div>


<div class="menucontainer"><a id="0" class='infobutton'>Click Me </a></div>
<div style="display:none;" id="box0">

    <div class="ratecontainer">
        <form  action="">
            <a class="ratebutton1">One</a><a class="ratebutton2">two</a>
        </form>
    </div>



</div>

    </body>
    </html>

2 个答案:

答案 0 :(得分:2)

我为您的代码创建了一个存根小提琴:http://jsfiddle.net/guard/P4KYL/

编辑它删除任何与php相关的内容(并在必要时手动放置多个项目)

然后将编辑后的版本发回去,我会检查它有什么问题。

答案 1 :(得分:-2)

    $('.ratebutton1').click(function() {

        $('.ratebutton2').hide();

    });

我相信这是一个问题。您的按钮不是名为.ratebutton1而是名为ratebutton1。取出时间并尝试一下。希望它有所帮助