gpt4 book ai didi

php - onclick DIV,从其他div上的数据库加载内容

转载 作者:行者123 更新时间:2023-11-29 18:37:12 25 4
gpt4 key购买 nike

我的想法是在html中将一个div的内容加载到其他div上。简而言之,我想了解新的 Facebook 收件箱是如何工作的,当我们单击右侧的消息时,内容会从数据库中获取并加载到中心列中。我知道它可能是由某些 AJAX 完成的,但无法弄清楚它是如何可能的。

提前致谢。

最佳答案

如果您使用jquery,您可以在div 上使用onclick 事件。

这是这样工作的 HTML/JS。

<!doctype html>
<html>
<head>
<title>Document Title</title>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>
$('.clickable').on('click', function(){
var data_id = $(this).data('id');
$.ajax({
url: 'ajax.php',
type: 'POST',
data: {id: data_id},
dataType: 'json',
success: function(data){
$('#more-info').html(data.html);
},
error: function(jqXHR, textStatus, errorThrown){
$('#more-info').html('');
alert('Error Loading');
}
});
});

});
</script>
</head>
<body>
<div id="item-one" class="clickable" data-id="123">Click me</div>
<div id="item-two" class="clickable" data-id="456">Click me</div>
<div id="more-info"></div>
</body>
</html>

假设我们有一个名为 ajax.php 的 PHP 文件,它将返回一个 json,就像我们之前在 ajax 函数中指定的那样 dataType: 'json' 并且我们正在发送通过 POST 获取 ID,因此这里有一个示例,您必须对其进行处理。

ajax.php

<?php
$id = (int)$_POST['id'];
$query = "SELECT * FROM messages WHERE message_id = {$id} LIMIT 1"; //expecting one row
$result = mysql_query( $query );
$message = mysql_fetch_assoc( $result ); //expecting just on row

$json = array();
$json['html'] = '<p>' . $message . '</p>';

header('Content-Type: application/json');
echo json_encode( $json );
?>

关于php - onclick DIV,从其他div上的数据库加载内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45194608/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com