0

为了使用正确的值(作为 $def var 传递)初始化 html 元素,我对该函数进行了一些Jquery (mobile)操作:.ready()

如果我评论此操作(请参阅脚本末尾),则脚本可以完美运行(但显然没有必要的 html 'select' 初始值)。

如果我使用这些操作,脚本运行正常(直到最后一个操作),但它永远不会到达下一条语句' get_status()'......

    <script type="text/javascript">

    var gauge_humidity1,
        gauge_temp1,
        gauge_temp2,
        gauge_temp3;


    jQuery(document).ready(function() {


        //### EVERYTHING WORK IF I COMMENT ALL THIS JQUERY'S ###
        //initiate sliders
        //OLD jQuery('#select_mode').val('$mode').slider('refresh');
        jQuery('#select_mode').val('$mode')
        jQuery('#select_r1_water').val('$r[0]');
        jQuery('#select_r2_heat').val('$r[1]');
        jQuery('#select_r345_window').val('$r[2]');
        jQuery('#select_r6_shadow').val('$r[5]');

        //initiate select_light
        jQuery('#select_light').val('$s_ini[2][5]');
        ### END OF COMMENT ###


        ### IF I UNCOMMENT THE GET_STATUS() NEVER RUNS ###
        get_status();
    });

</script>

        <form id="form_settings" action="" method="POST">
            <div id="section" data-role="collapsible-set">

                <div data-role="collapsible" data-collapsed="false">
                    <h3>
                        Control
                    </h3>
                    <div data-role="fieldcontain">
                        <label for="select_mode">
                            Modo
                        </label>
                        <select name="select_mode" id="select_mode" data-role="slider" onchange="update_mode()">
                            <option value="Manual">
                                Manual
                            </option>
                            <option value="Auto">
                                Auto
                            </option>
                        </select>

                    </div>
                </div>
            </div>
        </form>
4

2 回答 2

0

我认为问题是,在JQM$(document).ready()相当于$(document).ready()$(document).bind('pageinit')

看看 jQuery Mobile 文档:http: //jquerymobile.com/demos/1.1.1/docs/api/events.html

重要的: Use $(document).bind('pageinit'), not $(document).ready()

在 jQuery 中学习的第一件事是调用 $(document).ready() 函数中的代码,以便在加载 DOM 后立即执行所有内容。但是,在 jQuery Mobile 中,Ajax 用于在您导航时将每个页面的内容加载到 DOM 中,并且 DOM 就绪处理程序仅针对第一页执行。要在加载和创建新页面时执行代码,您可以绑定到 pageinit 事件。此事件在本页底部有详细说明。

编辑:

<script type="text/javascript">
        jQuery('#page_settings').bind('pageinit', function() {
         // Your code here
        });
</script>
于 2013-04-30T13:05:35.177 回答
0

解决方案:

刚刚在 html div data-role="page" 附近添加了“pageinit”,并应用于“#page_settings”页面(而不是文档),因为控件是。

    <div data-role="page" id="page_settings">
    <script type="text/javascript">
        jQuery('#page_settings').bind('pageinit', function() {
            //initiate sliders
            jQuery('#select_mode').val('$mode').slider('refresh');
            jQuery('#select_r1_water').val('$r[0]').slider('refresh');
            jQuery('#select_r2_heat').val('$r[1]').slider('refresh');
            jQuery('#select_r345_window').val('$r[2]').slider('refresh');
            jQuery('#select_r6_shadow').val('$r[5]').slider('refresh');

            //initiate select_light
            jQuery('#select_light').val('$s_ini[2][5]').selectmenu('refresh');
        });
    </script>
于 2013-04-30T21:56:04.233 回答