调整dokuwiki剧透风格内的代码?

时间:2012-08-03 14:00:58

标签: javascript css

要更改选择器,只有当我点击图像时它才会显示/隐藏我在.OS图像后直接放置扰流板/弹出菜单。现在popdown是.OS容器的子代,因此点击它会传递给.OS单击处理程序。

但代码并不完美,因为当我点击第一个MAC时,两个破坏者都会被打开。

但是我想要一次一个地打开剧透

但主要的问题是我无法在<td>标签内的这些类型的剧透(dokuwiki类)中正确修复javascript代码:

这是我使用的javascript代码:

<div class="dokuwiki">
    <div class="right_page">
        <div class="entry-content">
            <script type="text/javascript" src="./zzzz_files/jquery.js"></script>
            <script type="text/javascript">                                         
                $(document).ready(function(){
                    $(".nonjs").removeAttr( "href"); //href is needed for users without JS
                    $('.OS').click(function(){
                        if($(".details").is(":visible"))
                        {
                            $(".details").not(":hidden").hide("slow");
                            return true;
                        }
                        else
                        {
                            $(".OS").not(this).each(function(i) {
                                $(".details").hide("slow");
                            });
                            $(".details").show("slow");
                            return false;
                        }
                    });
                });  
            </script>     
            <style type="text/css">
                <!--
                .details {
                    display: none;
                    clear: both;
                    padding: 2px;
                }
                .nonjs{
                    cursor:pointer;
                }
                img {
                    border: 0px;
                }
                -->
            </style>

我考虑过做一个视频来更好地解释问题并提供用于测试代码的本地版本文件:

提前致谢

2 个答案:

答案 0 :(得分:1)

此代码有效:

 $(document).ready(function(){
 $(".nonjs").removeAttr( "href"); 
//href is needed for users without JS

 $('.OS').click(function(e){
           if(!$(e.target).parents('.details').length){
                        if($(this).find('.details').is(":visible"))
                        {
                            $(this).find('.details').not(":hidden").hide("slow");
                            return true;
                        }
                        else
                        {

                            $(this).find('.details').show("slow");
                            return false;
                        }
          }
});
 }); 

答案 1 :(得分:0)

我不知道你在问什么,但这就是我想你想要的:

单击图像时,显示其下方的详细信息并隐藏所有其他图像。如果细节已经可见,请隐藏它们。点击详细信息中的内容不应影响任何内容。

Demo

$(document).ready(function(){
  $(".nonjs").removeAttr( "href"); //href is needed for users without JS
  $('.OS').click(function(){
    var details = $(this).next(".details");
    $(".details").hide("slow");
    if(details.is(":hidden")) {
      details.show("slow");
    }
  });
});