-1

我有一个使用 JSONP 和 Zepto.js 的简单 BlackBerry 应用程序。大部分代码都写得很快，我没有使用 Zepto，因为我应该拥有并且将需要现在只测试它，我相信到目前为止我所有的代码都是有效的（JS 新手 - 只是学习）。

index.html 的示例

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <link  rel="stylesheet" type="text/css" href="css/bbsonic.css"><link />
        <link  rel="stylesheet" type="text/css" href="css/ocssui.css"><link />
        <title>Login</title>
        <script type="text/javascript" src="js/zepto.js"></script>
    </head>
    <body>
        <div data-role="page" class="page">

            <div data-role="header" class="header">
                <div id="header-logo">
                    <table>
                        <td valign="middle" class="museo">
                            <h1>BerrySonic</h1>
                        </td>
                    </table>
                </div>
            </div><!-- /header -->

            <div data-role="content" class="content" id="list-wrapper">
                <ul data-role="listview" id="servers" class="listview">
                       <li class="title-divider">Select a Subsonic Server</li>
                </ul>
            </div><!-- /content -->

        </div><!-- /page -->   
        <script type="text/javascript" src="js/index.js"></script>
    </body>
</html>

索引.js：

var db = window.openDatabase("bbsonic", "0.1", "SubSonic Server", 1024*1000);
$(document).ready = prepareDatabase();

function prepareDatabase() {                        
    db.transaction(function(tx) {
        var starterSQL = 'CREATE TABLE IF NOT EXISTS servers (id INTEGER PRIMARY KEY AUTOINCREMENT, name VARCHAR(255) NOT NULL, url VARCHAR(255) NOT NULL, port VARCHAR(255) NOT NULL, user VARCHAR(255) NOT NULL, pass VARCHAR(255) NOT NULL)';
        tx.executeSql(starterSQL, []);
    });
    showServerList();
}

function showServerList() {                     
    db.transaction(function (tx) {
        tx.executeSql('SELECT * FROM servers', [], function (tx, results) {
            var len = results.rows.length, i;
            for (i = 0; i < len; i++) {
                var id = results.rows.item(i).id;
                var name = results.rows.item(i).name;

                var parent = document.getElementById('servers');
                var listItem = document.createElement('a');
                listItem.setAttribute('href', 'main.html');
                listItem.setAttribute('onclick', 'setServerID(' + id + ')');
                if (i == 0) {
                    listItem.innerHTML = '<li class="first-item">' + name + '</li>';
                } else {
                    listItem.innerHTML = '<li>' + name + '</li>';
                }

                parent.appendChild(listItem);
            }

            var parent = document.getElementById('servers');
            var listItem = document.createElement('a');
            listItem.setAttribute('href','addnewserver.html');
            listItem.innerHTML = "<li>Add New Server</li>";
            parent.appendChild(listItem);
        });
    });
}

function setServerID(id) {
    sessionStorage.serverID = id;
}

config.xml（从github复制一份）：

<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns="http://www.w3.org/ns/widgets" 
   xmlns:rim="http://www.blackberry.com/ns/widgets" 
   version="1.0.0.0" rim:header="WebWorks Sample">

   <name>BerrySonic</name>
   <description>This is a sample application.</description>
   <content src="index.html"/>

<rim:category name="Media"/>
<rim:category name="Media"/>

    <rim:permissions>
        <rim:permit>access_shared</rim:permit>
        <rim:permit>record_audio</rim:permit>
        <rim:permit>read_geolocation</rim:permit>
        <rim:permit>use_camera</rim:permit>
        <rim:permit>read_device_identifying_information</rim:permit>
    </rim:permissions>

    <!-- 
        Universal APIs: 
            The following features are available on both Smartphone and Tablet OS
    -->
    <feature id="blackberry.app" required="true" version="1.0.0.0"/>
    <feature id="blackberry.app.event" required="true" version="1.0.0.0"/>
    <feature id="blackberry.system" required="true" version="1.0.0.0"/>
    <feature id="blackberry.system.event" required="true" version="1.0.0.0"/>
    <feature id="blackberry.ui.dialog" required="true" version="1.0.0.0"/>
    <feature id="blackberry.utils" required="true" version="1.0.0.0"/>

    <feature id="blackberry.media.camera" required="true" version="1.0.0.0"/>
    <feature id="blackberry.media.microphone" required="true" version="1.0.0.0"/>
    <feature id="blackberry.identity" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke" required="true" version="1.0.0.0"/>
    <feature id="blackberry.io.file" required="true" version="1.0.0.0"/>
    <feature id="blackberry.io.dir" required="true" version="1.0.0.0"/>

    <!-- 
        Smartphone APIs: 
            The following features are available ONLY on Smartphone
    --> 
    <feature id="blackberry.ui.menu" required="true" version="1.0.0.0"/>
    <feature id="blackberry.identity.phone" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.AddressBookArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.BrowserArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.CalendarArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.CameraArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.JavaArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.MapsArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.MemoArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.MessageArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.PhoneArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.SearchArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.invoke.TaskArguments" required="true" version="1.0.0.0"/>
    <feature id="blackberry.message" required="true" version="1.0.0.0"/>
    <feature id="blackberry.message.sms" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Address" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Attendee" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Appointment" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.category" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Contact" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Memo" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Recurrence" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Reminder" required="true" version="1.0.0.0"/>
    <feature id="blackberry.pim.Task" required="true" version="1.0.0.0"/>

    <feature id="blackberry.audio" required="true" version="1.0.0.0"/>
    <feature id="blackberry.audio.Player" required="true" version="1.0.0.0"/>

    <feature id="blackberry.find" required="true" version="1.0.0.0"/>
    <feature id="blackberry.phone.Phone" required="true" version="1.0.0.0"/>
    <feature id="blackberry.phone.PhoneLogs" required="true" version="1.0.0.0"/>

    <feature id="blackberry.push" required="true" version="1.0.0.0"/>
    <feature id="blackberry.find" required="true" version="1.0.0.0"/>

    <access subdomains="true" uri="*"/>

</widget>

在chrome和ripple中它工作得很好，但在黑莓上它只加载标题，甚至不加载无序列表！不知道如何去调试它...帮助将不胜感激。

4

1 回答 1

2

我不确定，但我认为您没有错误地使用某些 HTML 标签。通常，如果您制作 a <table>，则嵌套一个<tr>标签，然后将<td>标签嵌套在其中。例子

<table>
  <tr>
    <td><h1>BerrySonic</h1></td>
  </tr>
</table>

我建议完全删除表格并直接<h1>使用<div id="header-logo">. （除非 Zepto 出于某种非常奇怪的原因要求这样做。我不熟悉它）

此外，您的 java 脚本正在为您的列表创建不正确的 HTML。就像表格一样，<ul>元素应该有<li>嵌套在其中的元素。中的代码showServerList()将创建如下所示的 HTML：

<a href="main.html"><li class="first-item">Server 1</li></a>
<a href="main.html"><li>Server 2</li></a>

当您真正需要时：

<li class="first-item"><a href="main.html">Server 1</a></li>
<li><a href="main.html">Server 2</a></li>

尝试进行这些更改，看看它是否可以解决您的渲染问题。

于 2012-01-19T22:11:41.533 回答