HTML - 更改\更新页面内容而不刷新\重新加载页面 [英] HTML - Change\Update page contents without refreshing\reloading the page

查看:76
本文介绍了HTML - 更改\更新页面内容而不刷新\重新加载页面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我从数据库中获取数据并将其显示在一个 div 中......我想要做的是当我点击一个链接时它应该改变 div 的内容

一种选择是通过 URL 将参数传递给自身并重新加载页面...

我需要这样做无需重新加载\刷新...

<a href="#" onClick="<?php recp('1') ?>">一个</a><a href="#" onClick="<?php recp('2') ?>">两个</a><a href="#" onClick="<?php recp('3') ?>">三个</a><div id='myStyle'><?php要求 ('myConnect.php');$results = mysql_query("SELECT para FROM content WHERE para_ID='$id'");如果(mysql_num_rows($results)> 0){$row = mysql_fetch_array( $results );回声 $row['para'];}?>

目标是当我单击任何链接时,div 和 php 变量的内容会在不刷新的情况下更新....以便用户可以看到新数据,然后如果有查询是在新变量上执行的\s

p.s 我知道它需要一些 AJAX,但我不知道 AJAX .. 所以请回复一些我可以学习的东西......我的知识仅限于 HTML、PHP、一些 JavaScript 和一些 JavaScript.一些jQuery

解决方案

你的想法是正确的,所以这里是如何继续:onclick 处理程序在客户端运行,在浏览器,所以你不能直接调用 PHP 函数.相反,您需要添加一个 JavaScript 函数(如您所提到的)使用 AJAX 调用 PHP 脚本并检索数据.使用 jQuery,您可以执行以下操作:

<a href="#" onClick="recp('1')" >一个</a><a href="#" onClick="recp('2')" >两个</a><a href="#" onClick="recp('3')" >三个</a><div id='myStyle'>

然后你把你的 PHP 代码放到一个单独的文件中:(我在上面的例子中称之为 data.php)

 0){$row = mysql_fetch_array( $results );回声 $row['para'];}?>

I get the data from DB and display it in a div... what I want to do is when I click a link it should change the content of the div

one option is to pass parameter through URL to itself and reload the page...

I need to do it without reloading\refreshing...

<?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>

The goal is when I click any of the links the contents of the div and php variable\s gets updated without refreshing.... so that user could see new data and after that if some query is performed it is on new variable\s

p.s I know it is gonna require some AJAX but I don't know AJAX.. so please reply with something by which I can learn... my knowledge is limited to HTML, PHP, some JavaScript & some jQuery

解决方案

You've got the right idea, so here's how to go ahead: the onclick handlers run on the client side, in the browser, so you cannot call a PHP function directly. Instead, you need to add a JavaScript function that (as you mentioned) uses AJAX to call a PHP script and retrieve the data. Using jQuery, you can do something like this:

<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>

Then you put your PHP code into a separate file: (I've called it data.php in the above example)

<?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'];
  }
?>

这篇关于HTML - 更改\更新页面内容而不刷新\重新加载页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
PHP最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆