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

【问题标题】：How to disable header button of a collapsible in jquery mobile?如何在jquery mobile中禁用可折叠的标题按钮？
【发布时间】：2013-09-19 08:01:36
【问题描述】：

我有一个简单的可折叠，用 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>

我的意思是这个按钮：

【问题讨论】：

data-iconpos="notext"?
什么？能具体一点吗？
您是否尝试将data-iconpos="notext" 添加到主div？
刚试过。它不工作

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

【解决方案1】：

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

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

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

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

希望对你有帮助。

【讨论】：

【解决方案2】：

我找到了一个有效的解决方案。添加这个就可以了：

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

【讨论】：

【解决方案3】：

不需要任何 css 或 Jquery 来禁用它。只需在您的代码中包含 data-iconpos="none" ，如下所示。

<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>

【讨论】：