通過cURL發送數據，而無需重新加載頁面

在Facebook的iframe頁面（非選項卡）中，我想使用cURL將數據發佈到外部API，但是我寧願如果我的表單頁面沒有重新加載。通過cURL發送數據，而無需重新加載頁面

我想要一些jQuery Ajax的發生（「提交數據」消息提交表單和一個成功的消息curl_exec成功）。我正在考慮創建一個帶有重複表單的隱藏iframe，並以更改事件的形式更新值，但我不知道如何實現PHP和jquery之間的交換。

有沒有更好的方法？以下是我正在處理的代碼：

更新的代碼返回錯誤 - 不提交表單數據。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
</head> 

<body class="fb_canvas-resizable <?php print $body_classes; ?>"> 
    <?php echo $message; ?> 
    <div class="container"> 
     <div class="header"></div> 
     <div class="wrapper"> 
      <div class="content"> 
       <div class="left"> 
        <h1>Sign Up to Sign Off</h1> 
        <form name="signoff" action="curlsub.php" method="post"> 
         <input id="api" type="hidden" name="API_KEY" value="key"> 
        <div class="innerleft"> 
         <input id="fname" type="text" name="fname" class="inputs" tabindex="1" /></br /> 
         <label for="fname">First</label></br /></br /></br /> 
         <input type="text" name="email" class="inputs" tabindex="3" /></br /> 
         <label id="email" for="email">Email</label></br /></br /></br /> 
         <label for="gender">Gender</label></br /></br /> 
         <label for="gender">Age</label></br /></br /></br /> 
         <label for="gender">Income</label></br /></br /></br /> 
        </div> 
        <div class="innerright"> 
         <input id="lname" type="text" name="lname" class="inputs" tabindex="2" /></br /> 
         <label for="lname">Last</label></br /></br /></br /> 
         <input id="password" type="password" name="password" class="inputs" tabindex="4" /></br /> 
         <label for="email">Password</label></br /></br /></br /> 
         <input type="radio" name="sex" value="male" selected="selected" tabindex="5" /> Male 
         <input type="radio" name="sex" value="female" tabindex="6" /> Female</br /></br /> 
         <select name="age" tabindex="7" > 
          <option value=""></option> 
          <option value="baby">Baby</option> 
          <option value="teen">Teen</option> 
          <option value="young">Young</option> 
          <option value="old">Old</option> 
         </select><br /><br /> 
         <select name="income" tabindex="8"> 
          <option value=""></option> 
          <option value="none">None</option> 
          <option value="some">Some</option> 
          <option value="okay">Okay</option> 
          <option value="tons">Tons</option> 
         </select><br /><br /> 
         <input id="zip" type="text" name="c5" class="zip" tabindex="9" /></br /> 
         <label for="c5">Zip Code</label></br /></br /> 
         <label for="mformat">Newsletter</label></br /></br /> 
         <input type="checkbox" name="mformat" value="html" selected="selected" tabindex="10" /> HTML (iPhone, iPad, Droid)<br /><br /> 
         <input type="checkbox" name="mformat" value="text" tabindex="11" /> TEXT (Best for Blackberry) 
        </div> 
        <div class="button"><input type="image" src="button.jpg" name="submit" value="yes"></div> 
        </form> 
       </div> 
       <div class="right"> 
        <img src="logo.jpg" /> 
        <p>Updating you on today and prepping you for tomorrow.</p> 
        <a href="http://www.url.com">www.url.com</a> 
       </div> 
       <div class="clear"> 
      </div> 
      <div class="logged clear"> 
       <p>Logged in as Some Guy (<a href="#">not you?</a>)</p> 
      </div> 
     </div></div> 
     <div class="footer"></div> 
    </div> 
    <script> 
    $(document).ready(function() { 
     //$('div.wrapper').fadeOut(0); 
     window.fbAsyncInit = function() { 
      FB.init({appId: 'app', status: true, cookie: true}); 
      FB.Canvas.setSize(); 
     }; 
     (function() { 
      var e = document.createElement('script'); e.async = true; 
      e.src = document.location.protocol + 
      '//connect.facebook.net/en_US/all.js'; 
      document.getElementById('fb-root').appendChild(e); 
     }()); 
    }); 
    $('#signoff').submit(function() { 

     var fname = $("input#fname").val(); 
     var lname = $("input#fname").val(); 
     var email = $("input#email").val(); 
     var password = $("input#password").val(); 

     var dataString = 'fname='+ fname + '&lame=' + lname + '&email=' + email + '&password=' + password; 
     // alert(dataString); 
     // return false; 

     $.ajax({ 
     type: "POST", 
     url: "curlsub.php", 
     data: dataString, 
     success: function() { 
      //do some stuff 
     } 
     }); 
     return false; 
    }); 
    </script> 

</body> 
</html>

目前，這將成功將數據發送到外部PHP API，但IFRAME（或我的整個文件）在提交重新加載（並顯示「成功」的消息）。

來源

2010-11-24 Thomas McCabe

你想要做的是在你的表單的提交事件上發出一個AJAX Post請求。該AJAX Post請求的成功回調應更新您的用戶界面，以提醒用戶他們的帖子已成功完成。

$('#signoff').submit(
    //Ajax post request here 
    //http://api.jquery.com/jQuery.post/ 
    return false; //this stops your page from refreshing 
);

來源

2010-11-24 01:42:47

我更新了上面的代碼只是爲了測試刷新提交。仍清爽？ $ .ajax方法應該正常工作，一旦我沒有刷新變量。 – 2010-11-24 02:34:05

你有沒有看着http://api.jquery.com/jQuery.ajax/或http://api.jquery.com/jQuery.post/

下面的代碼應幫助您開始。

$.ajax({ 
    type: 'POST', 
    url: url, 
    data: data, 
    success: success 
    dataType: dataType 
});

哪裏 url是包含URL的字符串到的請求被髮送。

data是與請求一起發送到服務器的映射或字符串。

success是一個回調函數，如果請求成功執行。它應該有三個參數：(data, textStatus, XMLHttpRequest)

dataType是服務器期望的數據類型。

來源

2010-11-24 01:42:30 ecounysis

通過cURL發送數據，而無需重新加載頁面

回答

相關問題