PhoneGap(Cordova.js)和JQuery.Ajax不能在一起工作 [英] PhoneGap (Cordova.js) and JQuery.Ajax not working together

查看:218
本文介绍了PhoneGap(Cordova.js)和JQuery.Ajax不能在一起工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已经建立了一个html页面使用Phonegap + Jquery定位Andriod 4.12。

I have built a html page using Phonegap+Jquery targeting Andriod 4.12.

我的业务要求是使用cameraova.js的相机API拍摄照片,然后将此捕获的图片发送到ASMX Web服务。

My business requirement is to take a picture using the camera API of cordova.js and then post this captured picture to a ASMX web service.

问题:当我添加对Cordova.js的引用并运行应用程序时,我在LogCatUncaught ReferenceError :$未定义,但如果我删除对cordova.js的引用一切正常,我可以发布数据到Web服务。

Problem : When I add a reference to Cordova.js and run the application I get an error in the LogCat "Uncaught ReferenceError: $ is not defined" but if i remove the reference to cordova.js everything works fine and i am able to post data to web service.

我附加我的代码

<!DOCTYPE html>
<html>  
<head>    
<title>Capture Photo</title>   
<script type="text/javascript" charset="utf-8" src="cordova-2.1.0.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery.js"></script> 

<script type="text/javascript">

 var varType;
 var varUrl;
 var varData;
 var varContentType;
 var varDataType;
 var varProcessData;

  function InsertDetails() {
        alert('Inserting Details');
        varType = "POST";
        varUrl = "http://mobile.comp.com/service/userservice.asmx/InsertDetails";
        varContentType = "application/json; charset=utf-8";
        varDataType = "json";
        varProcessData = true;

        var uname = document.getElementById('txtname');
        var pwd = document.getElementById('txtpwd');
        CallService(uname.value, pwd.value);

        return true;
    }

    //Generic function to call AXMX/WCF  Service        
    function CallService(u, p) {
        $.ajax({ type: varType, url: varUrl, data: '{"username":"' + u + '","password":"' + p + '"}', contentType: varContentType, dataType: varDataType, processdata: varProcessData, success: function (msg) { ServiceSucceeded(msg); }, error: ServiceFailed });
    }

    function ServiceSucceeded(result) {

        var myObject = eval('(' + result.d + ')');
        alert(myObject);
    }
    function ServiceFailed(result) {
        alert('Service call failed: ' + result.status + '' + result.statusText);
        varType = null; varUrl = null; varData = null; varContentType = null; varDataType = null; varProcessData = null;
    } 
</script>
</head>
<body>
<input type=text id=txtname value=John />
<input type=text id=txtpwd value=Doe /> 
<input type="button" id="btnSearch" onclick="InsertDetails();" style="cursor: pointer;
    margin-top: 8px; vertical-align: top" value="Insert Details" />

     <button id=btn1>Capture Photo</button> 

</body>
</html>

请帮助我。

推荐答案

感谢Nick的帮助。第三个链接帮助了

Thanks Nick for your help. The 3rd link helped

最后我的代码工作了

我添加了以下代码行

jQuery.noConflict();

之后,JQuery被识别。

JQuery was recognised after that. Make sure to follow the proper sequence for javascripts else the code will not work.

我引用js文件的顺序:

The sequence in which I referred the js files:


  1. 参考JQuery.js(本地添加到项目中)

  2. jQuery.noConflict();



  3. 参考Cordova.js

  4. Cordova摄影机互动代码

  1. Reference to JQuery.js (locally added to project)
  2. jQuery.noConflict();
  3. Javascript Code for service calls
  4. Reference to Cordova.js
  5. Cordova Camera interaction code

这篇关于PhoneGap(Cordova.js)和JQuery.Ajax不能在一起工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆