当我在 HTML 中使用 jQuery 时,它工作正常。但是当我在 PHP 中 echo 时它不起作用。当我想读取内容时,它应该执行下拉操作。
这是它的样子。现在我想单击“查看”,它应该显示内容:
博客.php
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="javascript" type="text/javascript" href="jquery-3.1.1.min.js">
<script>
$(document).ready(function()
{
$('#drop').click(function()
{
$('.post').slideToggle('fast');
});
});
</script>
</head>
<body>
<div id="contain">
<div id="banner">
</div>
<div id="blogposts">
<?php
include 'constr.php';
$query = mysqli_query($connect,"SELECT * from blog LIMIT 10");
while($read = mysqli_fetch_array($query))
{
$yazar = $read["yazarAdi"];
$baslik = $read["baslik"];
$tarih = $read["tarih"];
$icerik = $read["icerik"];
echo '
<div id="postcontain">
<table class="info">
<tr>
<td><p style=" font-style:Italic;">'.$yazar.'</p> <td><p style="text-align:right; padding-right:10px; font-style:Italic;">'.$tarih.'</p></td>
</tr>
<tr>
<td><p style="padding-bottom:5px; font-size:15px; font-weight:bold;">'.$baslik.'</p></td>
<td style="text-align:right;"><a id="drop">View</a></td>
</tr>
</table>
'.$icerik.'
</div>
';
}
?>
</div>
</div>
</body>
</html>
CSS相关内容:
.post
{
background-color:White;
width:800px;
box-shadow:inset 1px 1px 100px 5px #ccc;
border-top:3px solid #ffc;
display:none;
}
最佳答案
单击必须滑动具有 post
类的元素:
$('.post').slideToggle('fast');
并且您缺少将具有此类的元素添加到代码中。
id
属性在同一文档中应该是唯一的,因此您必须将循环中的 id
更改为类,例如: drop
和 postcontain
。
注意:如果你的代码中有帖子,你现在的js会同时滑动所有帖子,所以你可能想转到父级postcontain
然后使用以下命令切换内部帖子:
$(this).closest('.postcontain').find('.post').slideToggle('fast');
完整的 JS :
$(document).ready(function()
{
$('.drop').click(function(){
$(this).closest('.postcontain').find('.post').slideToggle('fast');
});
});
希望这有帮助。
关于javascript - 无法在 PHP echo 中调用 jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41182021/