我可以将这两个函数合并为一个

我可以将这两个jQuery函数合并为一个吗？他们得到了相同的选择器，它看起来可以缩短或简化。我刚开始学习jQuery，所以不知道该怎么做。可以有人帮忙吗？由于我可以将这两个函数合并为一个

$(function(){ 
 
\t $(".button").click(function(){ 
 
    var box=$(this).find("a").attr("href"); 
 
\t 
 
    return false; 
 
}); 
 
    $(".button").on('click',function(){ 
 
\t var box=$(this).attr('data-box'); 
 
\t $('#'+box).toggle(); 
 
\t  
 
    }); 
 
});

.panel{ width: 80px;height: 25px; background: tan; display: inline-block;position:absolute; 
 
\t } 
 
.panel p{ margin: 0px 0px 10px 10px; 
 
\t } 
 
.button{ width: 30px;height: 30px; background: pink; display: inline-block; margin-bottom: 30px; 
 
\t } 
 
#box1 {top:50px;left:20px; display: none;} 
 
#box2 {top:50px;left:120px;display: none;} 
 
#box3 {top:50px;left:220px;display: none;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class="button" data-box="box1" >A 
 
</div> 
 
<div class="button" data-box="box2"> B 
 
</div> 
 
<div class="button" data-box="box3"> C 
 
</div> 
 
<div id="nav"> 
 
\t <div id="box1" class="panel "> 
 
\t \t <p>content</p> 
 
\t </div> 
 
\t <div id="box2" class="panel "> 
 
\t \t <p>content</p> 
 
\t </div> 
 
\t <div id="box3" class="panel"> 
 
\t \t <p>content</p> 
 
\t </div> 
 
</div>

来源

2014-12-22 dodo big

第一个什么都不做，什么是它有望做？ – charlietfl

@ charlietfl首先是能够使div可点击。 –

我很抱歉，但没有任何意义。不知道什么'使div可点击的意思 – charlietfl

我不明白为什么不能。

$(function(){ 
     $(".button").click(function(){ 
    var box=$(this).find("a").attr("href"); 

    var box=$(this).attr('data-box'); 
     $('#'+box).toggle(); 

    return false; 
    }); 
});

只要确保将return false移动到最后。

来源

2014-12-22 08:05:16 Scimonster

你不觉得'return false;'会跳过较低的代码段吗？ – Runcorn

好吧，永远不会介意我恢复了反对票：D – Runcorn

我不知道我是否有这个问题，但我想你的答案是;

$(function(){ 
     $(".button").click(function(){ 
    var box=$(this).find("a").attr("href"); 

var box1=$(this).attr('data-box'); 
     $('#'+box1).toggle(); 
    return false; 
});

来源

2014-12-22 08:06:09 geekido

$(function() { 
     $(".button").click(function() { 
     var url = $(this).find("a").attr("href"); 

     var box = $(this).attr('data-box'); 
     $('#' + box).toggle(); 

     return false; 
     }); 
);

我不知道什么的第一个变量是应该做的（它从来没有被使用），但我离开那里呢。

来源

2014-12-22 08:09:50 Makaze

您没有任何锚在你的HTML，因此在我看来，是不是需要你的第一个功能，因此代码，我建议是：

$(function() { 
    $(".button").on('click',function(){ 
     var box=$(this).attr('data-box'); 
     $('#'+box).toggle(); 

    }); 
});

来源

2014-12-22 08:24:17

我可以将这两个函数合并为一个

回答

相关问题