jQuery Mobile Select没有显示出来

时间:2015-05-05 00:22:12

标签: jquery html css jquery-mobile

我正在尝试使用jQuery mobile,但我无法使用select输入。据我所知,它的设置就像在文档中一样。

它位于fieldcontainer中,并且具有与select输入id匹配的for属性的标签。并且jqm css文件列在页面的head标签中。

为什么选择不显示以及如何获得它?

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Mod Chat</title>
    <link href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css" />
    <link href="css/modpanel.css?=v1.0" type="text/css" rel="stylesheet" />
    <link href="css/toastr.css" type="text/css" rel="stylesheet" />
</head>
<body>      
    <!-- Start of chat box page -->
    <div data-type="page" id="chatBoxMain">

        <div id="fileBox">          
            <form enctype="multipart/form-data">
            <label>Auto Grab Session:</label> 
            <input type="file" name="fileToUpload">
            </form>
            <button value="Give me my session" onclick="getSessionFromFile()">Get Session</button>
                <button id="chatLoad">Load Chat</button>
            </div><!-- End of file box -->

        <div id="chatBody"></div>

        <div id="warningPanelBox">

            <label>Offender:</label>
            <div id="warnee"></div>

            <div  data-role="fieldcontain">

                <label for="selectPunish-1" class="select">Punishment</label>
                <select name="selectPunish-1" id="selectPunish-1">
                    <option  value="warn">Warn</option>
                    <option value="mute">Mute</option>
                </select>

                <select>
                    <option>24</option>
                    <option>72</option>
                    <option>999</option>
                    <option>99999</option>
                </select>

                <select>
                    <option>Avoiding Filter</option>
                    <option>Inappropriate Words</option>
                    <option>Sexual references</option>
                    <option>Drugs/Alcohol references</option>
                    <option>Trolling</option>
                    <option>Spamming</option>
                    <option>Coordinates leakage</option>
                    <option>External link</option>
                    <option>Inappropriate commander name</option>
                    <option>Bad alliance name</option>
                    <option>Bad bio</option>
                    <option>Bad planet name</option>
                    <option>Inciting Rule Breakage</option>
                </select>
            </div><!-- End of fieldcontain -->      
            <button id="punish">Punish</button>
        </div> <!-- End of warningpanel box -->

    </div><!-- End of chat box page -->     

    <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>  
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js">    </script>
    <script src="js/md5.js"></script>
    <script src="js/common.js"></script>
    <script src="js/toastr.js"></script>
    <script src="js/dateFormat.js"></script>
    <script src="js/main.modpanel.js"></script>
    <script src="js/blacklist.js"></script>     
</body>
</html>

1 个答案:

答案 0 :(得分:0)

问题是jQuery UI链接与jQuery Mobile冲突。删除了UI链接及其顺利航行。

感谢您的帮助。