Question

在jsfiddle.net中它正在工作，但在从工作灯控制台预览应用时却没有：http://jsfiddle.net/sphakrrokr/k4L6ej9z/6/

之前，当简单的html被写入时它运作良好但位置不是并排搜索框并且去按钮

<input type="search" name="search" id="search" data-mini="true" placeholder="Search for Restaurants" data-theme="a" data-inline="true">
<input type="submit" value="Go" data-inline="true" id ="submit" onclick="getRestaurants()">

之后进行了一些并排定位的更改，但之后输入文字时没有显示...

<head>
    <style type="text/css">
    #the-page {float:center;width:100%}
    #submit_con {width:20%; float:left;}
    #search_con {width:80%; float:left;}
    #search {width:100%;}
    #submit {width:100%;}
    </style>
</head>

<body>
    <div data-role="header" id="the-page" data-position="fixed">
            <h3>YUMMY</h3>

            <div data-role="navbar" id="navbar" data-iconpos="left">
            <ul>
                <li><a href="#Favs" id="favs" data-icon="star">Favs</a></li>
                <li><a href="#myPanel" id="more" data-icon="bars">More</a></li><!-- PANEL LINK -->
            </ul>
        </div>

            <label for="search" id="label" style="font-weight: bold; font-style: italic; font-family: Comic Sans MS"></label>

<div id ="search_con">
    <input type="search" name="search" id="search" data-mini="true" placeholder="Search for Restaurants" data-theme="a">
    </div>
    <div id="submit_con">
<input type="submit" value="Go" data-inline="true" id ="submit" onclick="getRestaurants()">
        </div>

Answer 1

您提供的HTML不完整...
无论如何，你只是错过了一个DIV，但这并不会使文本字段无法运行。也就是说，它无论如何都能正常工作。

我已将您的HTML复制到新项目+应用程序（使用MFP Studio中的jQuery Mobile向导创建），然后是Run As＆gt;在MobileFirst Development Server上运行。从MFP控制台预览常用Web资源并尝试键入文本字段时 - 它正在运行：

enter image description here

common \ index.html：

<!DOCTYPE HTML>
<html>
        <head>
            <meta charset="UTF-8">
            <title>test</title>
            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
            <!--
                <link rel="shortcut icon" href="images/favicon.png">
                <link rel="apple-touch-icon" href="images/apple-touch-icon.png"> 
            -->
            <link rel="stylesheet" href="css/main.css">
            <script>window.$ = window.jQuery = WLJQ;</script>
        </head>
        <body style="display: none;">
            <div data-role="header" id="the-page" data-position="fixed">
                <h3>YUMMY</h3>

                <div data-role="navbar" id="navbar" data-iconpos="left">
                    <ul>
                        <li><a href="#Favs" id="favs" data-icon="star">Favs</a></li>
                        <li><a href="#myPanel" id="more" data-icon="bars">More</a></li><!-- PANEL LINK -->
                    </ul>
                </div>

                <label for="search" id="label" style="font-weight: bold; font-style: italic; font-family: Comic Sans MS"></label>

                <div id ="search_con">
                    <input type="search" name="search" id="search" data-mini="true" placeholder="Search for Restaurants" data-theme="a">
                </div>
                <div id="submit_con">
                    <input type="submit" value="Go" data-inline="true" id ="submit" onclick="getRestaurants()">
                </div>
            </div>

            <script src="js/initOptions.js"></script>
            <script src="js/main.js"></script>
            <script src="js/messages.js"></script>
        </body>
</html>

常见\ CSS \的main.css

#the-page {float:center;width:100%}
#submit_con {width:20%; float:left;}
#search_con {width:80%; float:left;}
#search {width:100%;}
#submit {width:100%;}

在搜索框中键入时预览不显示任何字母

1 个答案: