jquery移动表单提交。简单的表单,用户在表单提交页面

时间:2011-08-23 17:02:12

标签: forms jquery-mobile

我正在努力使用jquery mobile中的表单提交,api没有显示任何有用的示例。

这是我的HTML:

<div data-role="page" id="test" data-id="test">
                <div data-role="content">
                    <form id="form1">
                        <div id="titleDiv" data-role="fieldcontain">  
                            <label id="titlelabel" for="title">Title *</label>  
                            <select id="title" name="title">  
                            <option value="null">Please select a title</option>  
                            <option value="mr">Mr</option>  
                            <option value="miss">Miss</option>  
                            <option value="mrs">Mrs</option>  
                            <option value="ms">Ms</option>  
                            <option value="dr">Dr</option>  
                            </select>  
                        </div> 
                        <div id="submitDiv" data-role="fieldcontain">    
                        <input type="submit" value="Submit Form" data-inline="true"/>
                        </div>
                    </form>  
            </div> 
        </div>

    <div data-role="page" id="test" data-id="test">
        <p>form confirmation page</p>
    </div>

这是我的javascript:

$('div').live('pageshow',function(event, ui) {

$('#form1').submit(function() {
     alert('test');
     // Submit the form
     //        $.post("/forms/requestProcessor.php", form1Var.serialize(), function(data){
     //        });   

    $.mobile.changePage($("#test"), "slideUp");
    return false;
});           
});

在提交时,我希望它显示警报,然后将用户带到页面。目前,该代码显示警报3次无效。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

问题是您正在重新使用test ID。为第二页提供不同的ID,{id}​​ changePage将有效。另外,最好省略pageshow或将其限制为#test而不是页面中的所有div。