IOS中手风琴表不能移动的解决方法
我有一个手风琴的表上的所有设备和浏览器正常工作，但根本不工作在ios移动。我找到了解决的办法也仅为div的和使用href，但对我而言，我真的需要用几个列的表。在这里，你有我使用的自举代码http://jsfiddle.net/k3yrnsux/。
<divclass="table-content">
<tableid="table-collapse"class="tabletable-responsivetable-hovertable-striped"style="border-collapse:collapse;">
<thead>
<tr>
<th>#</th>
<th>Date</th>
<th>Description</th>
<th>Credit</th>
<th>Debit</th>
<th>Balance</th>
</tr>
</thead>
<tbody>
<trdata-toggle="collapse"data-target="#demo1"data-parent="table-collapse"class="accordion-toggle">
<td>1</td>
<td>05May2013</td>
<td>CreditAccount</td>
<tdclass="text-success">$150.00</td>
<tdclass="text-error"></td>
<tdclass="text-success">$150.00</td>
</tr>
<tr>
<tdcolspan="6"class="hiddenRow">
<divclass="accordian-bodycollapse"id="demo1">Loremipsumdolorsitamet,consecteturadipiscingelit.Pellentesquemalesuadaligulanonsemperfacilisis.Sedmattisliberovelconvallistincidunt.Sedtemporauctorultrices.</div>
</td>
</tr>
<trdata-toggle="collapse"data-target="#demo2"class="accordion-toggleaccordion-group">
<td>2</td>
<td>05May2013</td>
<td>CreditAccount</td>
<tdclass="text-success">$11.00</td>
<tdclass="text-error"></td>
<tdclass="text-success">$161.00</td>
</tr>
<tr>
<tdcolspan="6"class="hiddenRow">
<divid="demo2"class="accordian-bodycollapse">Loremipsumdolorsitamet,consecteturadipiscingelit.Pellentesquemalesuadaligulanonsemperfacilisis.Sedmattisliberovelconvallistincidunt.Sedtemporauctorultrices.</div>
</td>
</tr>
<trdata-toggle="collapse"data-target="#demo3"class="accordion-toggle">
<td>3</td>
<td>05May2013</td>
<td>CreditAccount</td>
<tdclass="text-success">$500.00</td>
<tdclass="text-error"></td>
<tdclass="text-success">$661.00</td>
</tr>
<tr>
<tdcolspan="6"class="hiddenRow">
<divid="demo3"class="accordian-bodycollapse">
<tableclass="tabletable-responsivetable-stripedtable-hover">
<thead>
<tr>
<th>#</th>
<th>Date</th>
<th>Description</th>
<th>Credit</th>
<th>Debit</th>
<th>Balance</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>05May2013</td>
<td>CreditAccount</td>
<tdclass="text-success">$150.00</td>
<tdclass="text-error"></td>
<tdclass="text-success">$150.00</td>
</tr>
<tr>
<td>1</td>
<td>05May2013</td>
<td>CreditAccount</td>
<tdclass="text-success">$150.00</td>
<tdclass="text-error"></td>
<tdclass="text-success">$150.00</td>
</tr>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</div>
function(o){
vars=t(this);
s.attr("data-target")||o.preventDefault();
varn=e(s),
a=n.data("bs.collapse"),
r=a?"toggle":t.extend({},s.data(),{
trigger:this
});
i.call(n,r)
}
.hiddenRow{
padding:0px!important;
}
.hiddenRowdiv{
margin:20px;
white-space:normal;
}
解决方法:
我已经跑到iOS的问题，以及引导。
由于某种原因，如果您手动附加到click事件tr元素它工程而不及的问题，但你不能对选择器通过额外的属性。
http://jsfiddle.net/8x3ub2xz/
似乎只有附加click事件时附加属性传递到选择器的问题吗？不知道为什么。
将
$(document).ready(function(){
$("tr").click(function(){
varsender=$(this);
vartargetId=$(sender.attr("data-target"))
targetId.toggle().collapse();
});
});
改为
$(document).ready(function(){
$("tr[data-toggle='collapse']").click(function(){
varsender=$(this);
vartargetId=$(sender.attr("data-target"))
targetId.toggle().collapse();
});
});
以上所述就是本文给大家分享的全部内容了，希望大家能够喜欢。