phonegap javascript ajax无法正常工作

时间:2015-06-12 15:24:12

标签: javascript jquery mysql ajax cordova

我是appuvelopment的nnewbie,并尝试使用phonegap开发移动应用程序。我有一个远程共享服务器,它包含mysql表。我想注册一个用户,该用户最终将通过javascript和ajax将数据发送到将在mysql表上发布数据的php服务器页面。

但在我的应用中,标题中的javascript代码无效。所以js页面中我有ajax编码连接到服务器。

应该做什么?



$(document).bind('deviceready', function(){
    $(function(){
        $('signup').submit(function(){
				var postData = $(this).serialize();
				alert("this");
				
            $.ajax({
                type: 'POST',
                data: postData,
                //change the url for your project
                url: 'http://205.251.133.242:2082//home/lyfspl62/public_html/addUsermobile.php',
                success: function(data){
                    console.log(data);
                    alert('Your comment was successfully added');
                },
                error: function(){
                    console.log(data);
                    alert('There was an error adding your comment');
                }
            });
            
            return false;
        });
    });
});

     <meta charset="utf-8" />
     <meta name="format-detection" content="telephone=no" />
     <meta name="msapplication-tap-highlight" content="no" />
        <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/index.css" />
       <link rel="stylesheet" type="text/css" href="css/main.css">
		<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
		
		<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
		<script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>
		<script type="text/javascript" src="cordova.js"></script>
		<script type="text/javascript" src="js/post.js"></script>
		
		<script type="text/javascript">
			function sunc() {		
				document.addEventListener("deviceready",onDeviceReady,false);
				alert("loading");
				document.getElementById("home").style.display="block";
				document.getElementById("login").style.display="none";
				document.getElementById("signup").style.display="none";
			}
			function login() {
				document.getElementById("home").style.display="none";
				document.getElementById("login").style.display="block";
				document.getElementById("signup").style.display="none";
			}
			
			function signup() {
				document.getElementById("home").style.display="none";
				document.getElementById("login").style.display="none";
				document.getElementById("signup").style.display="block";
			}
			
			function validatel(){
				var emaill = document.getElementById("emaill");
				var pwd = document.getElementById("passwordl");
				
				if(emaill=="null" || emaill==""){
					alert("email must be filled out");
					return false;
				}
				else(pwd=="null" || pwd==""){
					alert("password must be filled out");
					return false;
				}
			}
			function validates(){
				var emaill = document.getElementById("emaill");
				var pwd = document.getElementById("passwordl");
				
				if(emaill=="null" || emaill==""){
					alert("email must be filled out");
					return false;
				}
				else(pwd=="null" || pwd==""){
					alert("password must be filled out");
					return false;
				}
			}
		</script>
		
        <title>LyfSplash</title>
		
		
    </head>
    <body onload="sunc()">
	
		<h1>LyfSplash</h1>
		
		<div ata-role="page" class="home" id="home" >
		
			<button type="button" onclick="login())" >Login</button>
			<button type="button" onclick="signup()">signup</button>
			<script type="text/javascript">
			alert("working");
			</script>
		</div>
		
		<div class="login" id="login" >
		<form >
			email:<br>
			<input type="email" name="email" id="emaill" autocomplete="on">
			<br>
			Password:<br>
			<input type="password" name="password" id="passwordl" >
			
			
		</form>
		</div>

		<div class="signup" id="signup" >
		<form id="ff" action="http://205.251.133.242:2082//home/lyfspl62/public_html/addUsermobile.php">
			FirstName:<br>
			<input type="text" id="firstName">
			<br>
			LastName:<br>
			<input type="text" id="lastName">
			<br>
			Country:<br>
			<input type="text" id="Country">
			<br>
			City:<br>
			<input type="text" id="city">
			<br>
			Phone<br>
			<input type="text" id="phone">
			<br>
			Mobile<br>
			<input type="text" id="mobile">
			<br>
			email:<br>
			<input type="email" name="email" id="emails">
			<br>
			DOB<br>
			<input type="text" id="DOB">
			<br>
			
			<button type="submit" value="submit">Login</button>
		</form>
		</div>


    </body>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

您正在尝试将提交事件处理程序绑定到错误的元素。您应该将其绑定到form而不是包装器div。选择器中还缺少#。将您的代码更改为:

$('#ff').submit(function () {
    // ...
});

您还错过了错误回调中的data

error: function (data) {
    console.log(data);
    alert('There was an error adding your comment');
}