Ajax jquery php post初學者

Question

我很難學習如何使用ajax和jquery發佈一個按鈕，無需重新加載頁面。具體而言：表單仍在重新加載頁面，並且沒有變量正在更新。

這是我磕磕絆絆的代碼。

我之前使用過的Jquery/AJAX。只是PHP的

// $_POST['selected_dir'] is set when you click on a folder or link within the explore(r).php  

if (isset($_POST['selected_dir'])) 
    { 
     // last selected folder/directory 
    $current_dir = $_POST['selected_dir']; 
     // current_dir is the folder we are looking inside of. 
     // we make it a $session so that if we click a different submit (RELOAD) 
     // within the page it will remember $current_dir; 
    $_SESSION['selected_dir'] = $current_dir; // 
    } 

    else // if $_post isint set but $_session is 
    if (isset($_SESSION['selected_dir'])) 
     { 
$current_dir = $_SESSION['selected_dir']; 
} 
else 
{ 
// default folder/directory 
$current_dir = "$root"; //'D:\Hosting\538\html'; 
} 

<form action='explore.php' method='post'> 
    <input type='image' 
     src='$folder_icon' 
     alt='Submit' 
      name='' 
     value='submit'/> 

     <input type='hidden' 
       value='$f_path/$value' 
     name='selected_dir'/> 

     <input type='submit' 
     value='$value' 
     name='$value' 
     class='submit_into_link'/> 
</form> 

因此，除了每次偉大的工作，你點擊圖片或鏈接的頁面重新加載。 我終於得出結論，我需要使用jQuery和ajax，直到現在我從未使用過JavaScript。我一直讀通過教程，我真的不能連接點，使這項工作

我有這個在我的頭

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script> 

我有這個在我的網頁體內頂部

$.ajax 
    ({ 
    type: 'POST', 
    url: 'explore_be.php', 
    data: data, success: 
    success function(data, textStatus, jqXHR), 
    complete: function(), 
    dataType: dataType 
    }); 

我對上面的代碼有幾個問題。我不確定如何使用它。 我是否需要將這個ajax代碼放在onclick函數中？看起來像一些例子ive通過jQuery使用這樣的東西看看..

$(document).ready(function() 
{ 
$(".flip").click(function() // this is a piece of code i got from w3schools.com 
}); 

.flip上面是一個類。我看到他們在談論時使用按鈕

<button> 

但是如何使用特定輸入ID的表單中的按鈕？或者我應該只添加到表單輸入 onclick =「clicked（）」，然後把ajax放在那個函數中？ ajax是否也需要在$（document）.ready（function（））中？

我應該爲數據類型提供什麼？

我把我的php代碼放在explore_be.php文件中。

explore_be.php

// $_POST['selected_dir'] is set when you click on a folder or link within the explore(r).php  

if (isset($_POST['selected_dir'])) 
    { 
     // last selected folder/directory 
    $current_dir = $_POST['selected_dir']; 
     // current_dir is the folder we are looking inside of. 
     // we make it a $session so that if we click a different submit (RELOAD) 
     // within the page it will remember $current_dir; 
    $_SESSION['selected_dir'] = $current_dir; // 
    } 

    else // if $_post isint set but $_session is 
    if (isset($_SESSION['selected_dir'])) 
     { 
$current_dir = $_SESSION['selected_dir']; 
} 
else 
{ 
// default folder/directory 
$current_dir = "$root"; //'D:\Hosting\538\html'; 
} 

是不是所有有代碼隱藏頁？

我改變了我的表單沒有動作，但添加了onclick他們仍然重新加載頁面。我需要做什麼才能停止表單輸入？

我的新形式看起來像這樣

<form action='' method='post'> 
    <input type='image' 
     src='$folder_icon' 
     alt='Submit' 
      name='' 
     onclick='clickity()' 
      value='submit'/> 

     <input type='hidden' 
       value='$f_path/$value' 
     name='selected_dir'/> 

     <input type='submit' 
     value='$value' 
     name='$value' 
     onclick='clickity()' 
        class='submit_into_link'/> 
</form> 

任何幫助是極大的讚賞。

Answer 1

，你可以做這樣的：

HTML

<form action='explore.php' method='post' id='myForm'> 

jQuery的

$('#myForm').submit(function(event){ //added event 
    event.preventDefault(); //added to prevent submit 
    $.ajax 
     ({ 
     type: 'POST', 
     url: 'explore_be.php', 
     data: data, success: 
     success function(data, textStatus, jqXHR), 
     complete: function(), 
     dataType: dataType 
    }); 


}); 

編輯：刪除您在編輯添加

Answer 2

<form action='javascript:;' method='post'> 
    <input type='image' 
     src='$folder_icon' 
     alt='Submit' 
      name='' 
     onclick='clickity();'/> 

     <input type='hidden' 
       value='$f_path/$value' 
     name='selected_dir'/> 

     <input type='submit' 
     value='$value' 
     name='$value' 
     onclick='clickity();' 
     class='submit_into_link'/> 
</form> 

首先的onclick事件改變這個和te如果沒關係，請告訴我爲什麼你需要在同一個表格上提交2次？

Answer 3

您一次嘗試三件事。這會使事情變得複雜以找到錯誤所在。只需使用一個沒有jQuery的ajax和一個小例子。然後擴展它。

<html> 
<head> 
<script type="text/javascript"> 
function getdata(str) 
{ 
if (str.length==0) 
    { 
    document.getElementById("result").innerHTML=""; 
    return; 
    } 
if (window.XMLHttpRequest) 
    {// code for IE7+, Firefox, Chrome, Opera, Safari 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    {// code for IE6, IE5 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("result").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","response.php?q="+str,true); 
xmlhttp.send(); 
} 
</script> 
</head> 

<input type='submit' onclick='getdata(input)'> 
<div id='result'> 
</div> 
<body>