2012-01-07 3 views
2

В моем проекте PhoneGap Eclipse, я использую JQuery для визуальных эффектов с помощью ссылки библиотеки JQuery:PhoneGap Javascript ссылки вопрос

<link rel="stylesheet" 
     href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.css" /> 
    <script type="text/javascript" src="http://code.jquery.com/jquery.js"></script> 
    <script type="text/javascript" 
     src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.js"></script> 

и я также делать запросы удаленных доменов для того, чтобы отобразить некоторую информацию от удаленного сервера.

1: Когда я делаю запросы к нескольким серверам, я получаю сообщение об ошибке сказав:

DroidGap: TIMEOUT ERROR! - calling webViewClient

Я читал, что я должен изменить свой Phonegaps белый список, выполнив:

<phonegap> 
    <access origin="\*\" /> 
</phonegap> 

Источник: GitHub call-back

Но я получаю некоторую ошибку, поэтому я решил приблизиться к тем же результатам по-разному:

2: <script type="text/javascript" src="file:///android_asset/js/jquery.js"></script>

<script type="text/javascript" src="../js/jquery.js"></script>

Why? - because i would like to avoid getting errors with multiple-domain requests

В этих случаях я получаю сообщение об ошибке

SyntaxError: Parse error at file:///... in logcat

Я понятия не имею, почему это происходит, потому что указанный файл должен быть в обоих случаях.

Так что мои вопросы:

  • Почему я не могу включить файл .js таким образом?
  • Какое решение я должен продолжать пытаться приблизиться (1 или 2)?

structure

<html> 
<head> 
<title></title> 
<script src="phonegap-1.3.0.js"></script> 

<link rel="stylesheet" href="jquery.mobile-1.0.css" /> 
<script type="text/javascript" src="jquery.mobile-1.0.js"></script> 
<script type="text/javascript" src="jquery.js"></script> 

<!-- 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<link rel="stylesheet" href="lib/touch/resources/css/sencha-touch.css" type="text/css"> 
    <script type="text/javascript" src="lib/touch/sencha-touch.js"></script> 
    <!-- <script type="text/javascript" src="lib/touch/index.js"></script> --> 

<script> 
    var alreadyrunflag = 0 //flag to indicate whether target function has already been run 
    var url = "http://www.norwegian.no/"; 

    var currentTime = new Date(); 
    var month = currentTime.getMonth() + 1; 
    var year = currentTime.getFullYear(); 

    //on page loaded 
    if (document.addEventListener) 
     document.addEventListener("DOMContentLoaded", function() { 
      //alreadyrunflag = 1; 
      initGet(url); 
     }, false) 
    else if (document.all && !window.opera) { 
     //page load error? 
    } 

    function applyChangeEvent() { 
     //on selection changed 
     var selectDepart = document.getElementById("depart"); 
     var selectArrive = document.getElementById("arrive"); 

     selectDepart.onchange = function() { //run some code when "onchange" event fires 
      if (document.getElementsByTagName("select")[1].options[document 
        .getElementsByTagName("select")[1].options.selectedIndex].value != "" 
        && document.getElementsByTagName("select")[0].options[document 
          .getElementsByTagName("select")[0].options.selectedIndex].value != "") { 
       for (var monthsCount = 1; monthsCount < 13; monthsCount++) { 
        //alert(monthsCount); 
        get("http://www.norwegian.no/fly/lavpris/", monthsCount); 
       } 
      } 
     } 

     selectArrive.onchange = function() { //run some code when "onchange" event fires 
      if (document.getElementsByTagName("select")[1].options[document 
        .getElementsByTagName("select")[1].options.selectedIndex].value != "" 
        && document.getElementsByTagName("select")[0].options[document 
          .getElementsByTagName("select")[0].options.selectedIndex].value != "") { 
       for (var monthsCount = 1; monthsCount < 13; monthsCount++) { 
        //alert(monthsCount); 
        get("http://www.norwegian.no/fly/lavpris/", monthsCount); 
       } 
      } 
     } 
    } 

    function initGet(url) { 
     var request = new XMLHttpRequest(); 
     request.open("GET", url, true); 
     request.onreadystatechange = function() { 
      if (request.readyState == 4) { 
       if (request.status == 200 || request.status == 0) { 
        //request.responseText 
        getObjs(request.responseText); 
       } 
      } 
     } 
     request.send(); 
    } 

    function get(url, month) { 
     //alert(month); 

     url += "?D_City=" 
       + document.getElementsByTagName("select")[0].options[document 
         .getElementsByTagName("select")[0].options.selectedIndex].value; 
     url += "&A_City=" 
       + document.getElementsByTagName("select")[1].options[document 
         .getElementsByTagName("select")[1].options.selectedIndex].value; 
     url += "&TripType=1"; 
     url += "&D_Day=1"; 
     url += "&D_Month=" + getMonth(month); 
     /* url += "&R_Day=1"; 
     url += "&R_Month=201201"; */ 
     url += "&AdultCount=1"; 
     url += "&ChildCount=0"; 
     url += "&InfantCount=0"; 

     //alert(url); 

     var request = new XMLHttpRequest(); 
     request.open("GET", url, true); 
     request.onreadystatechange = function() { 
      if (request.readyState == 4) { 
       if (request.status == 200 || request.status == 0) { 
        //request.responseText 
        parse(request.responseText, month); 
       } 
      } 
     } 
     request.send(); 
    } 

    function getMonth(month) { 
     //alert(month.toString.length + " | " + month); 
     if (month.toString().length == 1) { 
      var tempMonth = "0" + month.toString(); 
      //alert(tempMonth); 
      return year.toString() + tempMonth; 
     } else 
      return year.toString() + month; 
    } 

    function getSimpleMonth() { 
     return month; 
    } 

    function getObjs(mainPageHtml) { 
     var mainDoc = (new DOMParser()).parseFromString(mainPageHtml, 
       "application/xhtml+xml"); 

     var select = mainDoc.getElementsByTagName("select")[1]; 
     var options = select.getElementsByTagName("option"); 

     var citiesArray = []; 

     for (var i = 0; i < options.length; i++) { 

      cityObj = new Object(); 
      cityObj.name = options[i].text; 
      cityObj.value = options[i].value; 

      citiesArray.push(cityObj); 
     } 

     for (var city = 0; city < citiesArray.length; city++) { 
      document.getElementById("depart").innerHTML += "<option value='"+citiesArray[city].value+"'>" 
        + citiesArray[city].name + "</option>"; 
      document.getElementById("arrive").innerHTML += "<option value='"+citiesArray[city].value+"'>" 
        + citiesArray[city].name + "</option>"; 
     } 

     applyChangeEvent(); 

    } 

    function parse(html, id) { 

     var pricesArray = []; 

     //alert(id); 

     var resultDoc = (new DOMParser()).parseFromString(html, 
       "application/xhtml+xml"); 

     var divs = resultDoc.getElementsByTagName("table"); 
     for (var div = 0; div < divs.length; div++) { 
      if (divs[div].className == "fareCalendarTable") { 
       //alert("found!"); 

       // TODO: find out how many to open!! 
       document.getElementById(id).style.display = "block"; 
       document.getElementById("nav_").style.display = "block"; 

       var table = resultDoc.getElementsByTagName("table")[div]; 
       var divs = table.getElementsByTagName("div"); 
       //var tbodyTrs = tbody.getElementsByTagName("tr"); 

       //alert(document.getElementById("month-one").innerHTML); 
       for (var price = 0; price < divs.length; price++) { 
        if (divs[price].title != "") { 

         /*      document.getElementById("month-one-results").innerHTML += divs[price].id 
         .replace("OutboundFareCal", "") 
         + " : " + divs[price].title + "<br>"; */ 

         priceObj = new Object(); 
         priceObj.date = divs[price].id.replace(
           "OutboundFareCal", ""); 
         priceObj.price = divs[price].title.replace(" NOK", ""); 
         priceObj.price.replace(/\s/g, ''); 

         pricesArray.push(priceObj); 
        } 
       } 

       /*    pricesArray.sort(function sortNumber(a, b) { 
       return parseInt(b) - parseInt(a); 
       }); */ 

       for (var priceUnit = 0; priceUnit < pricesArray.length; priceUnit++) { 
        document.getElementById("month-results-" + id).innerHTML += "<table><tr><td>" 
          + pricesArray[priceUnit].date 
          + "</td><td>" 
          + pricesArray[priceUnit].price 
          + "</td></tr></table>"; 
       } 

      } 

      document.getElementById("depart").disabled = "disabled"; 
      document.getElementById("arrive").disabled = "disabled"; 
     } 

     // document.getElementById("results").innerHTML = bodybox.item(0).innerHTML; 
     //holy grail! 
     var month = document.getElementById("month-" + id); 
     var spans = month.getElementsByTagName("span"); 

     for (var span = 0; span < spans.length; span++) { 
      if (spans[span].className == "ui-btn-text") { 
       spans[span].innerHTML += "<p>" + getCheapest(pricesArray) 
         + "</p>"; 
      } 
     } 
    } 

    function getCheapest(pricesArray) { 
     pricesArray.sort(sort); 

     return pricesArray[1].price; 
    } 

    function sort(a, b) { 
     if (a.price < b.price) 
      return -1; 
     if (a.price > b.price) 
      return 1; 
     return 0; 
    } 

    function restart() { 
     window.location.reload(); 
     return false; 
     document.getElementById("depart").removeAttribute("disabled"); 
     document.getElementById("arrive").removeAttribute("disabled"); 
    } 
</script> 
<style> 
body { 
    display: block; 
    padding: 20px; 
    color: #3D3C2F; 
    font-family: Arial, Sans-Serif, Helvetica; 
    font-size: 12px; 
    font-weight: normal; 
} 

div#content { 
    margin-left: auto; 
    margin-right: auto; 
    background: #fff; 
    height: 100%; 
    -webkit-border-bottom-left-radius: 8px; 
    -webkit-border-bottom-right-radius: 8px; 
    display: block; 
    color: #3D3C2F; 
    font-family: Arial, Sans-Serif, Helvetica; 
    font-size: 12px; 
    font-weight: normal; 
    background-image: 
     url(http://www.norwegian.no/Global/backgrounds/background_no.gif); 
    background-repeat: repeat-x; 
    background-repeat-x: repeat; 
    background-repeat-y: no-repeat; 
    background-position-x: 0%; 
    background-position-y: 0%; 
    width: 100%; 
    padding-top: 20px; 
    padding-bottom: 30px; 
} 

div#navigation { 
    margin-left: auto; 
    margin-right: auto; 
    padding: 20px; 
    position: block; 
    width: 80%; 
    background: #CCCC00; 
    -webkit-border-radius: 8px; 
} 

select { 
    position: block; 
    width: 100%; 
    text-color: #000; 
    overflow: hidden; 
} 
</style> 
</head> 
<body> 
    <div id="nav_" data-role="header" data-position="inline" data-theme="e" 
     style="display: none;"> 
     <a href="#" data-icon="back" data-theme="c" 
      onClick="window.location.reload();return false;">Start</a> 
     <h1>Ticket Prices</h1> 
    </div> 

    <div id="content"> 
     <div id="navigation"> 
      Fra/From: <select id="depart"> 
      </select> Til/To: <select id="arrive"> 
      </select> 
     </div> 

     <div data-role="collapsible" id="1" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-1">January</h3> 
      <p id="month-results-1"></p> 
     </div> 
     <div data-role="collapsible" id="2" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-2">February</h3> 
      <p id="month-results-2"></p> 
     </div> 
     <div data-role="collapsible" id="3" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-3">March</h3> 
      <p id="month-results-3"></p> 
     </div> 
     <div data-role="collapsible" id="4" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-4">April</h3> 
      <p id="month-results-4"></p> 
     </div> 
     <div data-role="collapsible" id="5" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-5">May</h3> 
      <p id="month-results-5"></p> 
     </div> 
     <div data-role="collapsible" id="6" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-6">June</h3> 
      <p id="month-results-6"></p> 
     </div> 
     <div data-role="collapsible" id="7" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-7">July</h3> 
      <p id="month-results-7"></p> 
     </div> 
     <div data-role="collapsible" id="8" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-8">August</h3> 
      <p id="month-results-8"></p> 
     </div> 
     <div data-role="collapsible" id="9" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-9">September</h3> 
      <p id="month-results-9"></p> 
     </div> 
     <div data-role="collapsible" id="10" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-10">October</h3> 
      <p id="month-results-10"></p> 
     </div> 
     <div data-role="collapsible" id="11" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-11">November</h3> 
      <p id="month-results-11"></p> 
     </div> 
     <div data-role="collapsible" id="12" 
      style="display: none; background: #fff; width: 97%; margin-left: auto; margin-right: auto;"> 
      <h3 id="month-12">December</h3> 
      <p id="month-results-12"></p> 
     </div> 
    </div> 
    <!-- <div id="results"></div> --> 
</body> 
</html> 
+0

Я не уверен. Но phonegap просто открывает ваш index.html как веб-страницу. из моего опыта я бы сказал, что лучше загружать файлы и перемещать их в папку sam как index.html, возможно, вложенную папку и включать их, используя их относительный путь. Это сделает ваше приложение больше, но сократит время загрузки. Также jQuery работает медленно. Не используйте его, если вам это не нужно. –

+0

@MetodMedja Я могу сказать, что такая же папка или дочерняя папка 'www' тоже не работает. На данный момент в моем приложении я просто тестирую, как он работает с jQuery, если я не исправлю проблему, тогда, вероятно, перейдем к Sancha –

+0

@MetodMedja, я просто хочу понять происхождение проблем, описанных выше. Различные источники объясняют разные причины этих проблем. –

ответ

1

Если ваша структура каталогов активов/WWW/JS/jquery.js использовать:

<script type="text/javascript" src="js/jquery.js"></script> 
+0

результат все тот же –

+0

Но в этом случае я не получаю никакой ошибки SyntaxError: Parse в файле: /// ... в log cat, поэтому это хороший старт –

+0

Вероятно, у вас есть другие структурные проблемы с вашим проектом. Вы можете запустить проект PhoneGap без jQuery? Вы указываете на файл с правильной версией phonegap * .js? Возможно, вам следует опубликовать весь файл index.html. –