我试图用一个简单的程序折叠一个可折叠的
JavaScript:
$( ".nuovoPaziente" ).trigger( "collapse" );
.HTML:
<div data-role="collapsible" data-collapsed="false" data-theme="b" id="nuovoPaziente">
</div>
但它不起作用。我有最新的jquery移动库1.1.1。我确定执行到达触发器代码,因为在检查它是否到达以执行代码之前,我有一个警报。知道吗?^^
您在可
折叠的定义中使用了ID
:
<div data-role="collapsible" data-collapsed="false" data-theme="b" id="nuovoPaziente">
因此,应该改为#nuovoPaziente
:
$( "#nuovoPaziente" ).trigger( "collapse" );
.nuovoPaziente
与class
有关;所以如果你想保持这个约定,你必须将你的可折叠修改为这样的内容:
$( ".nuovoPaziente" ).trigger( "collapse" );
<div data-role="collapsible" data-collapsed="false" data-theme="b" class="nuovoPaziente">
下面的例子对我有用:
JS/jQuery:
$(function() {
$("#collapse").click(function() {
console.log("ok");
$( "#nuovoPaziente" ).trigger( "collapse" );
});
});
.HTML:
<body>
<div data-role="page">
<div data-role="content">
<div data-role="collapsible" data-collapsed="false" data-theme="b" id="nuovoPaziente">
<h3>I'm a header</h3>
<p>I'm the collapsible content. By default I'm closed, but you can click the header to open me.</p>
</div>
<button id="collapse">collapse!</button>
</div>
</div>
</body>
我按如下方式调用库:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile.structure-1.1.0.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
您可以尝试上面的示例。
希望这有帮助。让我知道你的结果。