Question

我试图隐藏并在bootstrap手风琴旁边的div中显示图像。我正在使用的javascript工作，只有一个问题。

我希望当手风琴关闭时，用图像隐藏div，如果我点击相同的手风琴标题，这是有效的。不幸的是，如果手风琴是打开的，我点击另一个标题div，图像隐藏。

我知道使用Jquery可能更好，或者我需要在javascript中使用参数或条件，但我是一个剪切和粘贴的人，我找不到任何我可以使用的东西或轻松修改。这是脚本：

function slideContent(id) {
if ($('#' + id).css('display') == 'none') {
    $('#' + id).slideDown('100', function () { });
}
else {
    $('#' + id).slideUp('100', function () { });
}
}
</script>

这是小提琴http://jsfiddle.net/C7caU/21/。只有javascript在小提琴中不起作用，不会在点击时显示带有图像的div。为什么我不知道，它确实在浏览器中工作。由于Shukla Jay

，这个小提琴正常运作

任何帮助将不胜感激，谢谢。

Answer 1

如果未指定换行设置，则默认为“onLoad”。这会导致在加载结果后将所有JavaScript包装在函数运行中。所有变量都是此函数的本地变量，因此在全局范围内不可用。

将换行设置更改为“无换行”，它将起作用：

您的引导版本文件存在一些问题。我刚把它改成了这个。

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js">  </script>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">

Updated Fiddle See Here

Answer 2

<script type="text/javascript">
var tag = '';
function slideContent(id) {
if(id == tag){
    if (($('#pics').css('display') == 'none') && (id == tag)) {
        $('#pics').slideDown('100');
        tag = id;
    }else {
        $('#pics').slideUp('100');
        tag = '';
    }
   }else{
    $('#pics').slideDown('100');
    tag = id;
}
}

</script>

只需将#pics替换为您自己的。

与手风琴标题的bootstrap手风琴在同一页面上打开div

2 个答案: