Question

我正在使用android 2.2，phonegap 1.3和jquery-mobile 1.0

我有一个列表视图，其中列表中有一个元素，我想用它来创建一个对话框。我希望我的对话框在一个单独的文件中定义，以便我可以重复使用它，我希望它根据我传递的值设置标题。

我的对话框看起来像这样：

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
$(document).ready(function() {
    $("#title").append(SMSPLUS.queryString("title"));
});
</script>
<title>Dialog</title>
</head>
<body>
<div data-role="page" class="ui-page-z">
        <div data-role="header" data-theme="z" class="ui-bar-z">
    <h1 id="title"></h1>
    </div>
    <div data-role="content">
       ...
    </div>
</div>
</body>
</html>

我尝试使用带有title参数的#href（如下定义），打开对话框，但标题参数不存在。

<ul data-role="listview" data-theme="a">
    ...
    <li><a href="dialog.html?title=blah" data-rel="dialog"/></li>
    ...
</ul>

我已经读过我可以使用data-url，但在这种情况下，我不清楚我在哪里定义它（在<a>或<div>中包装它）以及如何我在对话框页面中提取了它。

修改

对于记录，该机制在标准浏览器中工作，但没有样式。

Answer 1

我在下面的<script>标签内创建了一个脚本，用于监听页面显示事件并更新输入的标题和占位符。

<div data-role="page" class="ui-page-z">
    <div data-role="header" data-theme="z" class="ui-bar-z">
        <h1 id="title">
        </h1>
    </div>
    <div data-role="content">
        <input placeholder="Type here..." id="configtext">
        </input>

    ...

    <script type="text/javascript">
        $("div.ui-page-z").live("pageshow", function(event, ui) {
            var dataUrl = $(".ui-page-active").attr("data-url");
            $("#title").empty();
            $("#title").append(SMSPLUS.getValue("title", dataUrl));
            $("#configtext").attr("placeholder", SMSPLUS.getValue("placeholder", dataUrl));
                    });
    </script>
</div>

放入标题时未检测到脚本（可能是因为框架没有注意到对话框的标题）

Answer 2

您可以尝试删除

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
$(document).ready(function() {
    $("#title").append(SMSPLUS.queryString("title"));
});
</script>
<title>Dialog</title>
</head>
<body>
</body>

并且仅返回正文html＆amp;你的ajax电话中的javascript。将两个DOMS合二为一会使浏览器感到困惑。

显示来自单独的html文件的对话框并向其传递参数

2 个答案: