0

使用 JQuery 移动设备导航时，我无法从输入中检索某些值。首次打开页面时，一切都按预期工作。但是，如果我离开然后返回页面，则输入的值不再对应于字段中的实际值。html如下

<!doctype html>
    <head>
       <meta charset="utf-8">
       <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

        <meta name="viewport" content="width=device-width,initial-scale=1.0">

        <link rel="stylesheet"  href="/static/jquery-ui-1.10.3.custom.min.css">
        <link rel="stylesheet"  href="/static/jquery-mobile/css/themes/default/jquery.mobile-1.3.2.min.css">

        <script src="/static/jquery-1.9.1.min.js"></script>
        <script src="/static/jquery-ui/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
        <script src="/static/jquery-mobile/js/jquery.mobile-1.3.2.min.js"></script>

      <!-- CSS: implied media="all" -->
    </head>


    <body>
        <div data-role="page" id = "main-page">

            <div data-role="header" style="overflow:hidden;">
            </div>

            <div id = "home" data-role="content">
                <input type = "text" name = "input_a" id = "input_a">

                <select id = "select_a" name = "select_a">
                    <option value = "a">A</option>
                    <option value = "b">B</option>
                    <option value = "c">C</option>
                </select>
            </div>

        </div>

        <script type="text/javascript">
            function set_condition()
            {
                var the_variable = "A";
                var page = $('[data-role="page"]:last'); 
                if (the_variable === "A")
                {
                    page.find("#select_a[value='a']").remove();
                    page.find("[name=select_a]").selectmenu('refresh').val('b');
                }
                console.log($('#select_a').val());
            }

            $(document).off('pageshow').on('pageshow', '#main-page', function ()
            {
                set_condition();
             });
        </script>
    </body>
</html>

所以，例如。当我第一次打开页面并选择选项 B 然后在我的 chrome 控制台（和 javascript）中输入

$('#select_a).val()

这将返回“b”。如果我随后浏览站点的剩余部分，然后返回同一页面并将选项更改为选项 C 并键入相同的命令，仍然会返回“b”。文本输入也出现了同样的问题。即，如果输入留空 - 导航后不返回任何值。同样，如果在导航空白时输入字段中留下一个数字，则输入字段为空但返回一个值...

因此，这些输入的值在导航后保持不变，即使在选择的情况下，值似乎已更改。为什么是这样？

4

1 回答 1

0

这可能会对您有所帮助：在 <head> 部分中，执行以下操作，

<script>
      $(document).on('pagehide', function(e){
           $(e.target).remove();
      });
</script>

这将删除 dom 中任何现有的页面缓存。您可能知道，第一页（完全重新加载）在访问其他页面后仍保留在 dom 中。

于 2013-08-18T22:35:59.323 回答