我有一個(gè)手風(fēng)琴的表上的所有設(shè)備和瀏覽器正常工作，但根本不工作在 ios 移動(dòng)。我找到了解決的辦法也僅為 div 的和使用 href，但對(duì)我而言，我真的需要用幾個(gè)列的表。在這里，你有我使用的自舉 代碼http://jsfiddle.net/k3yrnsux/ 。
<div class="table-content">
<table id="table-collapse" class="table table-responsive table-hover table-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>
<tr data-toggle="collapse" data-target="#demo1" data-parent="table-collapse" class="accordion-toggle">
<td>1</td>
<td>05 May 2013</td>
<td>Credit Account</td>
<td class="text-success">$150.00</td>
<td class="text-error"></td>
<td class="text-success">$150.00</td>
</tr>
<tr>
<td colspan="6" class="hiddenRow">
<div class="accordian-body collapse" id="demo1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque malesuada ligula non semper facilisis. Sed mattis libero vel convallis tincidunt. Sed tempor auctor ultrices.</div>
</td>
</tr>
<tr data-toggle="collapse" data-target="#demo2" class="accordion-toggle accordion-group">
<td>2</td>
<td>05 May 2013</td>
<td>Credit Account</td>
<td class="text-success">$11.00</td>
<td class="text-error"></td>
<td class="text-success">$161.00</td>
</tr>
<tr>
<td colspan="6" class="hiddenRow">
<div id="demo2" class="accordian-body collapse">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque malesuada ligula non semper facilisis. Sed mattis libero vel convallis tincidunt. Sed tempor auctor ultrices.</div>
</td>
</tr>
<tr data-toggle="collapse" data-target="#demo3" class="accordion-toggle">
<td>3</td>
<td>05 May 2013</td>
<td>Credit Account</td>
<td class="text-success">$500.00</td>
<td class="text-error"></td>
<td class="text-success">$661.00</td>
</tr>
<tr>
<td colspan="6" class="hiddenRow">
<div id="demo3" class="accordian-body collapse">
<table class="table table-responsive table-striped table-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>05 May 2013</td>
<td>Credit Account</td>
<td class="text-success">$150.00</td>
<td class="text-error"></td>
<td class="text-success">$150.00</td>
</tr>
<tr>
<td>1</td>
<td>05 May 2013</td>
<td>Credit Account</td>
<td class="text-success">$150.00</td>
<td class="text-error"></td>
<td class="text-success">$150.00</td>
</tr>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</div>
function (o) {
var s = t(this);
s.attr("data-target") || o.preventDefault();
var n = e(s),
a = n.data("bs.collapse"),
r = a ? "toggle" : t.extend({}, s.data(), {
trigger: this
});
i.call(n, r)
}
.hiddenRow {
padding:0px!important;
}
.hiddenRow div {
margin: 20px;
white-space:normal;
}
解決方法:
我已經(jīng)跑到 iOS 的問(wèn)題，以及引導(dǎo)。
由于某種原因，如果您手動(dòng)附加到 click 事件 tr 元素它工程而不及的問(wèn)題，但你不能對(duì)選擇器通過(guò)額外的屬性。
http://jsfiddle.net/8x3ub2xz/
似乎只有附加 click 事件時(shí)附加屬性傳遞到選擇器的問(wèn)題嗎？不知道為什么。
將
$(document).ready(function () {
$("tr").click(function () {
var sender = $(this);
var targetId = $(sender.attr("data-target"))
targetId.toggle().collapse();
});
});
改為
$(document).ready(function () {
$("tr [data-toggle='collapse']").click(function () {
var sender = $(this);
var targetId = $(sender.attr("data-target"))
targetId.toggle().collapse();
});
});
以上所述就是本文給大家分享的全部?jī)?nèi)容了，希望大家能夠喜歡。
【網(wǎng)站聲明】本站部分內(nèi)容來(lái)源于互聯(lián)網(wǎng),旨在幫助大家更快的解決問(wèn)題，如果有圖片或者內(nèi)容侵犯了您的權(quán)益，請(qǐng)聯(lián)系我們刪除處理，感謝您的支持！