Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/81.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 单击可折叠内容使其折叠_Javascript_Html_Css_Jquery Mobile - Fatal编程技术网

Javascript 单击可折叠内容使其折叠

Javascript 单击可折叠内容使其折叠,javascript,html,css,jquery-mobile,Javascript,Html,Css,Jquery Mobile,我在应用程序中使用可折叠小部件。我希望当用户单击内容中的任何位置时,它的内容会崩溃 是我的JSFIDLE,所以您可以从这里开始 <div data-role="collapsible-set" id="AccidentDetailsCol"> <div data-role="collapsible" class="animateMe" data-theme="b" data-content-theme="a" data-divider-t

我在应用程序中使用可折叠小部件。我希望当用户单击内容中的任何位置时,它的内容会崩溃

是我的JSFIDLE,所以您可以从这里开始

<div data-role="collapsible-set" id="AccidentDetailsCol">
                    <div data-role="collapsible" class="animateMe" data-theme="b" data-content-theme="a" data-divider-theme="b" data-collapsed="false">
                    <h3>Accident Details</h3>
                        <ul data-role="listview" data-inset="true" style="margin: 0 0 0 0px;">
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Accident Number: </h2>
                                <label for="text" id="accNumber" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Date: </h2>
                                <label for="text" id="accDate" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Time: </h2>
                                <label for="text" id="accTime" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">City:</h2>
                                <label for="text" id="accCity" class="wrap" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Location:</h2>
                                <label for="text" id="accLocate" class="wrap" style="margin: 0 0 0 0px;"></label>
                            </li>

                        </ul>
                    </div>

                    <div data-role="collapsible" class="animateMe" data-theme="b" data-content-theme="a" data-divider-theme="b">
                    <h3>Assured Details</h3>
                        <ul data-role="listview" data-inset="true" style="margin: 0 0 0 0px;">
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Car License Plate Number: </h2>
                                <label for="text" id="accAssLicenPlat" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Claim Number:</h2>
                                <label for="text" id="accAssClaimNum" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Claim Status:</h2>
                                <label for="text" id="accAssClaimStat" style="margin: 0 0 0 0px;"></label>
                            </li>
                        </ul>
                    </div>

                    <div data-role="collapsible" class="animateMe" data-theme="b" data-content-theme="a" data-divider-theme="b">
                    <h3>Litigant Details</h3>
                        <ul data-role="listview" data-inset="true" style="margin: 0 0 0 0px;">
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Name: </h2>
                                <label for="text" id="accLitName" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Telephone: </h2>
                                <label for="text" id="accLitTel" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">E-mail: </h2>
                                <label for="text" id="accLitMail" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Driver License Number: </h2>
                                <label for="text" id="accLitDrivLicen" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Car License Number: </h2>
                                <label for="text" id="accLitCarLicenNum" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Car Brand: </h2>
                                <label for="text" id="accLitCarBrand" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Car Color: </h2>
                                <label for="text" id="accLitCarColor" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Has Insurance: </h2>
                                <label for="text" id="accLitHasIns" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <div id="histLitInsDet">
                                </div>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Claim Number:</h2>
                                <label for="text" id="accLitClaimNum" style="margin: 0 0 0 0px;"></label>
                            </li>
                            <li>
                                <h2 style="margin: 0 0 0 0px;">Claim Status:</h2>
                                <label for="text" id="accLitClaimStat" style="margin: 0 0 0 0px;"></label>
                            </li>
                        </ul>
                    </div>
                </div>

事故详情
  • 意外数字:
  • 日期:
  • 时间:
  • 城市:
  • 地点:
确定的细节
  • 车牌号码:
  • 索赔编号:
  • 索赔状态:
诉讼细节
  • 姓名:
  • 电话:
  • 电邮:
  • 驾驶执照号码:
  • 汽车牌照号码:
  • 汽车品牌:
  • 汽车颜色:
  • 有保险:
  • 索赔编号:
  • 索赔状态:

感谢您提供的所有建议和解决方案。

添加以下JQUERY代码

$(".ui-collapsible-content").on("click", function (e) { 
  $(this).siblings(".ui-collapsible-heading").click();
  $(this).slideUp(300);
});

非常感谢您@当然,当我点击鼠标时,鼠标的位置是错误的。我很抱歉。。。。你的答案是最好的答案!!