HTML - Изменить\Обновить содержимое страницы без обновления\перезагрузки страницы

Я получаю данные из БД и отображаю их в div... что я хочу сделать, когда я нажимаю ссылку, это должно изменить содержимое div

один параметр - передать параметр через URL-адрес себе и перезагрузить страницу...

Мне нужно сделать это без перезагрузки\обновления...

<?php   
    $id   = '1';

    function recp( $rId ) {
        $id   = $rId;
    }
?>

<a href="#" onClick="<?php recp('1') ?>" > One   </a>
<a href="#" onClick="<?php recp('2') ?>" > Two   </a>
<a href="#" onClick="<?php recp('3') ?>" > Three </a>

<div id='myStyle'>
<?php
    require ('myConnect.php');     
    $results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");

    if( mysql_num_rows($results) > 0 ) {
        $row = mysql_fetch_array( $results );
        echo $row['para'];
    }
?>
</div>

Цель состоит в том, когда я нажимаю любую из ссылок, содержимое переменной div и php\s обновляется без обновления... так что пользователь может видеть новые данные, а после этого, если некоторые запрос выполняется на новой переменной \s

ps Я знаю, что мне понадобится AJAX, но я не знаю AJAX.. поэтому, пожалуйста, ответьте на что-то, чему я могу научиться... мои знания ограничены HTML, PHP, некоторым JavaScript и некоторым jQuery

Ответ 1

У вас есть правильная идея, так вот как это сделать: обработчики onclick работают на стороне клиента, в браузере, поэтому вы не можете напрямую вызвать функцию PHP. Вместо этого вам нужно добавить функцию JavaScript, которая (как вы упомянули) использует AJAX для вызова PHP скрипт и получения данных. Используя jQuery, вы можете сделать что-то вроде этого:

<script type="text/javascript">
function recp(id) {
  $('#myStyle').load('data.php?id=' + id);
}
</script>

<a href="#" onClick="recp('1')" > One   </a>
<a href="#" onClick="recp('2')" > Two   </a>
<a href="#" onClick="recp('3')" > Three </a>

<div id='myStyle'>
</div>

Затем вы помещаете свой PHP-код в отдельный файл: (я назвал его data.php в приведенном выше примере)

<?php
  require ('myConnect.php');     
  $id = $_GET['id'];
  $results = mysql_query("SELECT para FROM content WHERE  para_ID='$id'");   
  if( mysql_num_rows($results) > 0 )
  {
   $row = mysql_fetch_array( $results );
   echo $row['para'];
  }
?>

Ответ 2

jQuery выполнит эту работу. Вы можете использовать либо функцию jQuery.ajax, которая является общей для выполнения вызовов ajax, либо ее оболочками: jQuery.get, jQuery.post для получения/публикации данных. Его очень простая в использовании, например, проверка этого учебника, в котором показано, как использовать jQuery с PHP.