2012-06-21 5 views
0

i ont un code à l'aide PhoneGap mobile jquery + et l'exécuter sur mon Android, je veux rediriger la page vers div id contenu ... je veux dire après que je prends une photo je voudrais charger la page suivante ... voici mon code ...(ASK) window.location.href ne marche pas le travail jquery

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" /> 
     <meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
     <link rel="stylesheet" href="js/jquery.mobile-1.0.min.css" /> 
     <script src="js/jquery-1.6.4.min.js"></script> 
     <script src="js/jquery.mobile-1.0.min.js"></script> 
     <script type="text/javascript" charset="utf-8" src="phonegap-1.1.0.js"></script> 
     <script type="text/javascript" charset="utf-8"> 
     var deviceReady = false; 

     /** 
     * Take picture with camera 
     */ 
     function takePicture() { 
      navigator.camera.getPicture(

      function (uri) { 
       var img = document.getElementById('camera_image'); 
       img.style.visibility = "visible"; 
       img.style.display = "block"; 
       img.src = uri; 
       document.getElementById('camera_status').innerHTML = "Success"; 
       window.location.href = "#page2"; 

      }, function (e) { 
       console.log("Error getting picture: " + e); 
       document.getElementById('camera_status').innerHTML = "Error getting picture."; 
      }, { 
       quality: 50, 
       destinationType: navigator.camera.DestinationType.FILE_URI 
      }); 
     }; 

     /** 
     * Select picture from library 
     */ 
     function selectPicture() { 
      navigator.camera.getPicture(

      function (uri) { 
       var img = document.getElementById('camera_image'); 
       img.style.visibility = "visible"; 
       img.style.display = "block"; 
       img.src = uri; 
       document.getElementById('camera_status').innerHTML = "Success"; 
       window.location.href = "#page2"; 
      }, function (e) { 
       console.log("Error getting picture: " + e); 
       document.getElementById('camera_status').innerHTML = "Error getting picture."; 
      }, { 
       quality: 50, 
       destinationType: navigator.camera.DestinationType.FILE_URI, 
       sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY 
      }); 
     }; 

     /** 
     * Upload current picture 
     */ 
     function uploadPicture() { 

      // Get URI of picture to upload 
      var img = document.getElementById('camera_image'); 
      var imageURI = img.src; 
      if (!imageURI || (img.style.display == "none")) { 
       document.getElementById('camera_status').innerHTML = "Take picture or select picture from library first."; 
       return; 
      } 

      // Verify server has been entered 
      server = document.getElementById('serverUrl').value; 
      if (server) { 

       // Specify transfer options 
       var options = new FileUploadOptions(); 
       options.fileKey = "file"; 
       options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1); 
       options.mimeType = "image/jpeg"; 
       options.chunkedMode = false; 

       // Transfer picture to server 
       var ft = new FileTransfer(); 
       ft.upload(imageURI, server, function (r) { 
        document.getElementById('camera_status').innerHTML = "Upload successful: " + r.bytesSent + " bytes uploaded."; 
       }, function (error) { 
        document.getElementById('camera_status').innerHTML = "Upload failed: Code = " + error.code; 
       }, options); 
      } 
     } 

     /** 
     * View pictures uploaded to the server 
     */ 
     function viewUploadedPictures() { 

      // Get server URL 
      server = document.getElementById('serverUrl').value; 
      if (server) { 

       // Get HTML that lists all pictures on server using XHR 
       var xmlhttp = new XMLHttpRequest(); 

       // Callback function when XMLHttpRequest is ready 
       xmlhttp.onreadystatechange = function() { 
        if (xmlhttp.readyState === 4) { 

         // HTML is returned, which has pictures to display 
         if (xmlhttp.status === 200) { 
          document.getElementById('server_images').innerHTML = xmlhttp.responseText; 
         } 

         // If error 
         else { 
          document.getElementById('server_images').innerHTML = "Error retrieving pictures from server."; 
         } 
        } 
       }; 
       xmlhttp.open("GET", server, true); 
       xmlhttp.send(); 
      } 
     } 

     /** 
     * Function called when page has finished loading. 
     */ 
     function init() { 
      document.addEventListener("deviceready", function() { 
       deviceReady = true; 
      }, false); 
      window.setTimeout(function() { 
       if (!deviceReady) { 
        alert("Error: PhoneGap did not initialize. Demo will not run correctly."); 
       } 
      }, 2000); 
     } 
     </script> 
    </head> 
    <body onload="init();"> 
     <!-- Page 1 --> 
     <div data-role="page" id="page1"> 
      <!-- Page 1 Header --> 
      <div data-role="header"> 
       <h1>Ambil Gambar</h1> 
      </div> 
      <!-- Page 1 Content --> 
      <div data-role="content"> 
       <center> 
        <a href="javascript:void(0)" onclick="takePicture();"> 
         <img src="image/camera.png" width="150px" height="150px"></a> 
        <br> 
        <br> 
        <b>Atau</b> 
        <br> 
        <br> 
        <a href="javascript:void(0)" onclick="selectPicture();"> 
         <img src="image/upload.png"></a> 
        <p>Find my friend Page 3 
         <a href="#page2">here</a> 
        </p> 
       </center> 
      </div> 
      <!-- Page 1 Footer --> 
      <div data-role="footer"> 
       <h4>Footer 1</h4> 
      </div> 
     </div> 
     <!-- Page 2 --> 
     <div data-role="page" id="page2"> 
      <!-- Page 2 Header --> 
      <div data-role="header"> 
       <h1>Header 2</h1> 
      </div> 
      <!-- Page 2 Content --> 
      <div data-role="content"> 
       <img style="width:100%;visibility:hidden;display:none;" id="camera_image" src="" /> 
       <p>Find my friend Page 3 
        <a href="#page3">here</a> 
       </p> 
      </div> 
      <!-- Page 2 Footer --> 
      <div data-role="footer"> 
       <h4>Footer 2</h4> 
      </div> 
     </div> 
     <!-- Page 3 --> 
     <div data-role="page" id="page3"> 
      <!-- Page 3 Header --> 
      <div data-role="header"> 
       <h1>Header 3</h1> 
      </div> 
      <!-- Page 3 Content --> 
      <div data-role="content"> 
       <h3>Server:</h3> 
       <b>Images on server:</b> 
       <div id="server_images"></div> 
       <input type="button" onclick="uploadPicture();" value="Upload Picture" /> 
       <input type="button" onclick="viewUploadedPictures();" value="View Uploaded Pictures" /> 
      </div> 
     </div> 
    </body> 

</html> 

Quelqu'un peut-il m'aider s'il vous plaît? merci ... avant

Répondre

1

Au lieu de window.location.href utilisation window.location.hash.

+0

merci ... cela fonctionne ... :) –

+0

@ WawanDenFrastøtende: Si cela a résolu votre problème, alors vous devez accepter la réponse afin que les gens sachent qu'il a été résolu. Jetez un oeil à: http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work – forsvarir

Questions connexes