Jquery mobile:从java脚本中打开页面div对话框

我有我的jQuery移动页面如下。它有文本字段和一个div的形式，我需要显示为对话框，这是在同一页(div与id"dialog1")后，由Java脚本提交的表单。

<!DOCTYPE html>
<html>
<head>
  <title>title</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="/themes/site_theme/css/mobile.css" />
  <link rel="stylesheet" href="/themes/site_theme/css/jquery.mobile-1.2.0.css" /> 
  <script src="/themes/site_theme/js/jquery-1.7.1.min.js"></script> 
  <script src="/themes/site_theme/js/jquery.mobile-1.2.0.js"></script> 
  <script src="/themes/site_theme/js/min.js"></script> 
</head>
<body><div data-role="page" id="registerPage">
<div data-role="header">
        <a href="/app/index" data-icon="home" data-theme="b">Home</a>
        <h1>Brand List</h1>
        <a href="#"  data-role="button" data-rel="back" data-icon="arrow-l"data-theme="b">Back</a> 
</div>
    <div data-role="content">
                <form data-ajax="false" id="textForm" >
                <textarea name="comments" id="comments" placeholder='Type your comments'  size="85"></textarea>
                <div  align="center">
                    <input data-mini="true" data-inline="true" type="button" value="Submit" onClick="javascript: formText();" />
                    <input type="hidden"  name="company_id"  value="3" >
                    <input type="hidden"  name="branch_id"   value="3" >
                    <input type="hidden"  name="campaign_id" value="6" >
                </div>
            </form>
</div>

<div data-role="dialog" id="dialog1" class="app-dialog">
        <div data-role="header">
             <h3>A dialog</h3>
        </div>
            <div id="content" data-role="content">
                   <p>I am a dialog....!</p>
        </div>
   </div>

        </div>
</body>
</html>

如果我理解正确你想知道如何显示对话框?如果我是正确的，那么你有一个错误，你的对话框是一个registerPage页面的一部分。把它往上移一级。

看一下这个例子，我从你的代码:http://jsfiddle.net/Gajotres/yWTG2/

$('#registerPage').live('pagebeforeshow',function(e,data){    
    $('#test-button').live('click', function(e) {
        $.mobile.changePage('#dialog1', { transition: "pop", role: "dialog", reverse: false } );
    });    
});

相关内容

最新更新

热门标签：