Question

请帮我解决这个问题。我是CSS和jQuery Mobile的新手，我遇到了这个问题。

我页面中的复选框不显示该框;只有标签。单击标签时，左侧会出现一个正方形。

现在，只有在我将CSS文件下载到本地文件并引用它时才会出现问题。如果我直接从服务器引用CSS文件，则该框出现在文本之前并正常工作。以下是示例来源：

有错误的来源：

<!DOCTYPE HTML> 
<html>
    <head>
        <title>Mobile App Login</title> 
        <meta name=viewport content="user-scalable=no,width=device-width">
        <link rel="stylesheet" href="../jQuery/jquery.mobile.css">
        <script src="../jQuery/jquery.js"></script>
        <script src="../jQuery/jquery.mobile.js"></script>
    </head>
    <body>
        <div data-role=page id=home>

            <div data-role=header>
                <h1>Login Screen</h1> 
            </div>

            <div data-role=content>
                <label>
                    <input type="checkbox" name="checkbox-0" /> 
                    I agree 
                </label>
                <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" />
                <label for="checkbox-1">I agree</label>
            </div>
        </div>
    </body>
</html>

没有错误的来源：

<!DOCTYPE HTML>
<html>
    <head>
        <title>Mobile App Login</title>
        <meta name=viewport content="user-scalable=no,width=device-width" />
        <link rel="stylesheet"  href="http://jquerymobile.com/test/css/themes/default/jquery.mobile.css" />
        <script src="../jQuery/jquery.js"></script>     
        <script src="../jQuery/jquery.mobile.js"></script>
    </head>
    <body>
        <div data-role=page id=home>

            <div data-role=header>
                <h1>Login Screen</h1>
            </div>

            <div data-role=content>
                <label>
                    <input type="checkbox" name="checkbox-0" /> 
                    I agree 
                </label>
                <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" />
                <label for="checkbox-1">I agree</label>
            </div>
        </div>
    </body>
</html>

其他一切都很好;它只是盒子的显示导致我的问题。我获取了CSS和JS文件的最新文件并进行了检查。

如果没有该框，用户可能会认为它只是一个标签

由于我是新人，我无法提供图像，对不起......

谢谢大家。

Answer 1

在fieldset中为我添加复选框解决了同样的问题。

<fieldset data-role="controlgroup">
  <input type="checkbox" name="checkbox-2" id="checkbox-2" class="custom" />
  <label for="checkbox-2">I agree</label>
</fieldset>

jquery移动复选框显示问题

1 个答案: