Jquery Mobile点击事件在几次后停止工作/触发

时间:2012-10-25 14:36:03

标签: jquery events mobile

我有一个带有两个Jquery Mobile页面的HTML文件

<!-- Home Page -->
    <div data-role="page" id="home">
    <div data-theme="a" data-role="header">
        <h1>FortiSizer</h1>
    </div>

    <div data-role="content">
            <div id="myForm"></div>
            <a id="sizeit" data-role="button" data-theme="a" data-inline="false">Size It</a>
        <script type="text/javascript">
                jQuery("#home").on('pageinit', function(event, data) {
                 jQuery("#sizeit").on("click",function(e){
                    sizeItClick();
                    return false;
                });
            });
        </script>
    </div>
</div>

    <!-- Product Page -->
<div data-role="page" id="productInfo">
    <div data-theme="a" data-role="header">
        <a id="back" data-role="button" data-inline="true" data-direction="reverse" data-rel="back" data-transition="slide" data-icon="arrow-l" data-iconpos="left" class="ui-btn-left">Back</a>
        <h1 id="productName"></h1>
    </div>

        <div data-role="content">
                 <div id="detail"></div>
            </div>
    </div>

在头部我有以下代码

<script type="text/javascript">
        jQuery(document).on('pagecreate', function(event, data) {
            generatePageForm();
        });
</script>

在主页中生成表单。主要思想是在用户从选择元素中选择模型后显示产品详细信息(产品页面)。一切正常,两次!

生成表单,单击“sizeIt”按钮,加载产品详细信息页面,单击该页面上的后退按钮,然后返回主页。但是,第三次执行此操作时,sizeit按钮停止工作,并且产品页面不会显示。 我做错了什么?

1 个答案:

答案 0 :(得分:0)

可能是在返回按钮使用后没有触发的pageinit事件,请尝试使用pageshow: (jQuery mobile's pageinit causing problems on navigating back

jQuery("#home").on('pageshow', function(event, data) {
             jQuery("#sizeit").on("click",function(e){
                sizeItClick();
                return false;
            });
        });