如何在jquery mobile中禁用可折叠的标题按钮?

时间:2013-09-19 08:01:37

标签: jquery html css jquery-mobile jquery-mobile-collapsible

我有一个简单的可折叠,用jquery mobile制作。如何禁用可折叠的标题中的按钮,这是为了展开折叠可折叠?我想禁用它,仍然能够以编程方式折叠/扩展。整个过程是为了防止用户崩溃/扩展,以便在必须扩展可折叠的时刻进行完整的程序控制。

<div data-role="collapsible" data-collapsed="true" id="d27" name="d27" class="ui-block-a">
    <h4></h4>
    <div class="ui-block-a">
    <legend>D27: Question?</legend>
    </div>
    <div class="ui-block-b">
      <fieldset data-role="controlgroup" data-type="horizontal">
        <input type="radio" name="nameHere" id="si27" value="1" />
        <label for="si27">Sì</label>
        <input type="radio" name="nameHere" id="no27" value="0" checked="checked" />
        <label for="no27">No</label>
        </fieldset>
    </div>
</div>

这是我的意思是: button collapsible jquery mobile

3 个答案:

答案 0 :(得分:1)

要停止点击工作但保持能够触发展开,请使用此jquery:

$(document).ready(function () {
    $("#d27 h4").click(function (event) {
        return false;
    });
});

这仅适用于浏览器,为了防止它在移动设备上,您还必须捕获点击事件。

$("#d27 h4").on("tap", function (event, ui) {
    return false;
});

希望它对你有所帮助。

答案 1 :(得分:0)

我找到了一个有效的解决方案。添加它可以解决问题:

$("#d27 h4 a").click(function (event) {
    return false;
});

答案 2 :(得分:0)

不需要任何css或Jquery来禁用它。只需包含data-iconpos =&#34; none&#34;在你的代码如下。

<div data-role="collapsible" data-iconpos="none" data-collapsed="true" id="d27" name="d27" class="ui-block-a">
    <h4></h4>
    <div class="ui-block-a">
    <legend>D27: Question?</legend>
    </div>
    <div class="ui-block-b">
      <fieldset data-role="controlgroup" data-type="horizontal">
        <input type="radio" name="nameHere" id="si27" value="1" />
        <label for="si27">Sì</label>
        <input type="radio" name="nameHere" id="no27" value="0" checked="checked" />
        <label for="no27">No</label>
        </fieldset>
    </div>
</div>