讓一個div裝載的論壇無需重新加載

頁我很想知道，如果有可能，我可以有一個div重裝像窗口一樣。原因是我有一個論壇，但我不想在完成四個完整頁面後重新加載。所以我在想，如果按下提交按鈕時，只是在該分區或論壇部分的元素可以做一個背景重載或只是負載由他們自己。讓一個div裝載的論壇無需重新加載

這是在信息獲取鍵入一個文件名爲的論壇。我希望它不會重新加載網頁，但留在這個論壇，並且仍然將數據發送到數據庫。

<html> 
 
    <body> 
 
    
 
     <form action="demo.php" method="post" /> 
 
      <p>Input 1: <input type="text" name="firstname" /></p> 
 
      <input type="submit" value="Submit" /> 
 
     </form> 
 

 
     <div id = "load_results"></div> 
 
    </body> 
 
</html>

這是發送信息到數據庫，但我希望它被巧妙地完成。

<?php 
 
$servername = "localhost"; 
 
$username = "root"; 
 
$password = "root"; 
 
$dbname = "myDB"; 
 

 
// Create connection 
 
$conn = new mysqli($servername, $username, $password, $dbname); 
 
// Check connection 
 
if ($conn->connect_error) { 
 
    die("Connection failed: " . $conn->connect_error); 
 
} 
 

 
$value = $_POST['firstname']; 
 

 
$sql = "INSERT INTO MyGuests (firstname) VALUES ('$value')"; 
 

 

 
if ($conn->query($sql) === TRUE) { 
 
    echo "<a href=https://twitter.com/angela_bradley>My Twitter</a>"; 
 
} else { 
 
    echo "Error: " . $sql . "<br>" . $conn->error; 
 
} 
 

 
$conn->close(); 
 
?>

來源

2016-01-21 Jack

Ajax是你需要使用的東西。 – Rasclatt

修正語法和代碼縮進 – wogsland

是的，有一種方法。它被稱爲AJAX--但不用擔心，它非常簡單。

您的代碼將是這個樣子：

HTML：

<form action="demo.php" method="post" /> 
    <p>Input 1: <input type="text" name="firstname" /></p> 
    <input type="submit" value="Submit" /> 
</form>

JS/jQuery的：

$(function(){ 
    $('form').submit(function(evt){ 
    //next line stops form submission from sending you to `demo.php` 
    evt.preventDefault(); //evt stands for "event" - can be anything. I use e.preventDefault() 
    var fn = $('[name=firstname]').val(); 
    $.ajax({ 
     type: 'post', 
     url: 'demo.php', //send data ONLY to demo.php -- page stays as it is 
     data: 'first='+fn, 
     success: function(d){ 
      if (d.length) alert(d); 
     } 
    }); //END ajax 
}); //END document.ready

demo.php

<?php 
    $fn = $_POST['fn']; 
    //Do your database insert here 

    //If you wish, you can return some data to the AJAX's success function: 
    echo 'You submitted: ' .$fn;

這裏有一些帖子用簡單的AJAX的例子：

AJAX request callback using jQuery

來源

2016-01-21 03:31:57 gibberish

謝謝@gibberish是我會把js/jQuery – Jack

我在哪裏放置js/jQuery – Jack

我試圖使用此代碼，但它不能回答我的問題 – Jack

讓一個div裝載的論壇無需重新加載

回答

相關問題