jQuery Ajax从WordPress脚本获取jsonp请求

Question

I'm building a script for a phonegap app and i am using jquery and ajax to grab some json from my wordpress site and display it. 我正在为phonegap应用构建脚本，并且我正在使用jquery和ajax从我的wordpress网站中获取一些json并显示它。 The script i have isn't displaying any content and the console isn't showing any errors, so maybe one of the pros could help me out here: 我拥有的脚本没有显示任何内容，控制台没有显示任何错误，所以也许一位专家可以在这里帮助我：

LIST PAGE (HTML): 列表页（HTML）：

<ul data-role="listview" id="post-list"></ul>

SINGLE POST PAGE (HTML): 单个帖子页（HTML）：

<ul data-role="listview" id="post-data"></ul>

JavaScript: JavaScript：

 $(document).on('pageinit', '#home', function () {

     $.ajax({
         url: 'http://chris.floppytron.com/api/get_recent_posts/',
         dataType: "jsonp",
         success: function (result) {
             ajax.parseJSONP(result);
         },
         error: function (request, error) {
             alert('Network error has occurred please try again!');
         }
     });
 });

 $(document).on('pagebeforeshow', '#headline', function () {
     $('#post-data').empty();
     $.each(postInfo.result, function (i, row) {
         if (row.id == postInfo.id) {
             $('#post-data').append('<li>' + row.title + '</li>');
             $('#post-data').append('<li>' + row.date + '</li>');
             $('#post-data').append('<li>' + row.categories + '</li><br />');
             $('#post-data').append('<li>' + row.content + '</li>');
             $('#post-data').listview('refresh');
         }
     });
 });

 $(document).on('vclick', '#post-list li a', function () {
     postInfo.id = $(this).attr('data-id');
     $.mobile.changePage("#headline", {
         transition: "slide",
         changeHash: false
     });
 });

 var postInfo = {
     id: null,
     result: null
 }

 var ajax = {
     parseJSONP: function (result) {
         postInfo.result = result.results;
         $.each(result.results, function (i, row) {
             console.log(JSON.stringify(row));
             $('#post-list').append('<li><a href="" data-id="' + row.id + '"><img src="' + row.thumbnail + '"/><h3>' + row.title + '</h3><p>' + row.categories + '</p><br /><p>' + row.date + '</p></a></li>');
         });
         $('#post-list').listview('refresh');
     }
 }

Answer 1

 <!doctype html>
 <html>
 <head>
 <meta charset="UTF-8">
<title>Untitled Document</title>
  <link rel="stylesheet" type="text/css" href="js/jquery.mobile-1.3.0.min.css"/>
  <script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
  <script type="text/javascript" src="js/jquery.mobile-1.3.0.min.js"></script>
  <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
  <script>

function onBodyLoad() 
{
document.addEventListener('deviceready', onDeviceReady);    
}

function onDeviceReady()
{
$("#btnSubmit").live('touchend',onSubmit);
 }

function onSubmit() {

var postData = $("form").serialize();

alert(postData);

$.ajax({
    type: 'POST',
    data: postData,
    url: 'http://www.nextflow.in.th/example/phonegap/post/post.php',
    success: function(data){
        alert(data);
        alert('Your comment was successfully added');
    },
    error: function(){

        alert('There was an error adding your comment');
    }
});

} }

 <body onLoad="onBodyLoad()">
  <div data-role="page" id="page">
  <div data-role="header">
  <h1>Example</h1>
  </div>
  <div data-role="content">
  <form>
    <label for="email">Email:</label>
    <input type="email" id="email" name="email">
    <label for="nickname">Nick name: </label>
    <input type="text" id="nickname" name="nickname">
  </form>
  <a href="#" data-role="button" id="btnSubmit">Submit</a>
  <div id="result">
  </div>
  </div>
  <div data-role="footer">
  <h4>Nextflow.in.th</h4>
  </div>
  </div>
  </body>
  </html>

jQuery Ajax从WordPress脚本获取jsonp请求

问题描述

1 个解决方案

解决方案1
0 2014-08-25 08:06:52

jQuery Ajax从WordPress脚本获取jsonp请求

问题描述

1 个解决方案

解决方案1 0 2014-08-25 08:06:52

解决方案1
0 2014-08-25 08:06:52