Jquery移动表单数据在单个文件中的两个页面之间提交?

时间:2014-09-26 12:16:28

标签: javascript jquery html jquery-mobile

  

我想将数据'home_page'页面发送到'get_data'page.how来获取   来自主页的数据并使用jquery发送到第二页

<div class="main">
<!-- first page -->
    <section id="home_page" data-role="page">
        <header data-role="header">
            <h1>Header</h1>
        </header><!-- /header -->
        <article role="main" class="ui-content">
        <!-- Form -->
            <form action="" method="post" accept-charset="utf-8">
             form data send here            
            </form>
        </article><!-- /content -->
        <footer data-role="footer">
            <h1>Footer</h1>
        </footer><!-- /footer -->
    </section><!-- second page -->
    <section id="get_data" data-role="page">
        <header data-role="header">
            <h1>Header</h1>
        </header><!-- /header -->
        <article role="main" class="ui-content">
            <p> display the data here from home page </p>
        </article><!-- /content -->
        <footer data-role="footer">
            <h1>Footer</h1>
        </footer><!-- /footer -->
    </section><!-- /page -->
</div>

1 个答案:

答案 0 :(得分:1)

您可以获取第1页上的表单数据,并将表单值附加到第2页。完成后,您可以根据需要更改页面。在演示中,“提交”按钮转到第2页。

<强>码

$("#sub").on( "click", function( event ) {
var first = $('#first').val();
var last  = $('#last').val();

$("#formdata").empty();

var pagedata = $("<p>" + first + "</p><p>" + last + "</p>");    

pagedata.appendTo("#formdata");

$("#formdata").enhanceWithin();

$( ":mobile-pagecontainer" ).pagecontainer( "change", "#get_data", { transition: "pop" } );    
})

<强>演示

http://jsfiddle.net/j6btvLym/