0

当我使用 touchstart 事件在我的 phonegap 应用程序上显示一个 div 时,这就是打开 div,但也单击一个按钮进入这个 div。

你有什么想法可以防止按钮被触发吗?

4

1 回答 1

0

...我不知道你的意思,但也许这有帮助->

如果你使用 jQuery,你可以这样做:

HTML

<div class="container">
  <div class="header">Bla blah</div>
  <div class="content">
    <p> Some content here </p>
  </div>
</div>

<div class="container collapsed">
  <div class="header">Bla blah</div>
    <div class="content">
    <p> Some content here </p>
  </div>
</div>

CSS

.container{
  width:300px;
  background:#ccc;
  margin:10px;
  float:left;
}

.header{
  background:url('http://cdn1.iconfinder.com/data/icons/vaga/arrow_up.png') no-repeat;
  background-position:right 0px;
  cursor:pointer;
}

.collapsed .header{
  background-image:url('http://cdn2.iconfinder.com/data/icons/vaga/arrow_down.png');
}

.content{
  height:auto;
  min-height:100px;
  overflow:hidden;
  transition:all 0.3s linear;
  -webkit-transition:all 0.3s linear;
  -moz-transition:all 0.3s linear;
  -ms-transition:all 0.3s linear;
  -o-transition:all 0.3s linear;
}
.collapsed .content{
  min-height:0px;
  height:0px;
}

JS

$(function(){
  $('.header').click(function(){
    $(this).closest('.container').toggleClass('collapsed');
  });

});

这是一个适合你的小提琴:http: //jsfiddle.net/AMzfe/

于 2014-09-03T08:35:04.553 回答