如何为php选择数据库添加SLIDE DOWN/SLIDE UP功能
How to add SLIDE DOWN/SLIDE UP function for php selects from database?
一直在尝试添加SLIDE UP/SLIDE DOWN功能到PHP SELECT从一个表,但不幸的是,它似乎有点错过了一些东西。
我的代码已经有一个滑动上/下函数init,它涉及到文本区和提交按钮。现在我需要对问题和答案行使用相同的函数。其中问题由表1调用,而答案来自表2。
我会把问题作为一个链接,这样当我们点击它时,表2中的答案列表就会滑下来。
我的代码如下::<div class="name">
<?php
$sql = "SELECT * FROM input ORDER BY date DESC";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
$index = 0;
while($row = $result->fetch_assoc()) {
$index++;
$myid = $row["id"] ;
$sql2 = "SELECT * FROM output WHERE question_id = $myid ORDER BY date DESC";
$result2 = $conn->query($sql2);
?>
<div id="q">
<B><big><font color= #ba4a00> Q:</font></big><a class="About" href="#" class="question" id="question_'.$index.'"> <?php echo $row["question"]; ?></a> </B>
<?php
echo '<button class="add" id="add_'.$index.'"><B>Add Answer</B></button>';
echo '<form style="display:none;" name="answerswer_'.$index.'" method="post" action="output.php">'; // I dont think openning form from row to row would be nice!
echo '<input type="hidden" name="questionid" value="'. $row['id'].'"/>';
echo '<textarea type="text" class="addtext" name="addtext" required id="addtext_'.$index.'" placeholder="Please type your answer here.." ></textarea>';
echo '<button onClick="addsubmit('.$index.');" type="submit" id="addsubmit_'.$index.'" class="addsubmit"><B>Submit</B></button>';
echo '</form>';
?>
<small><p><?php echo $row["date"]; ?></p></small>
<?php
if ($result2->num_rows > 0) {
while($row2 = $result2->fetch_assoc()) {
?>
<div name="answersw" id="answersw_'.$index.'">
<B><big><font color= #ba4a00> A:</font></B></big> <small><?php echo $row2["answerswer"]; ?></small></br>
</div>
<?php
}
} else {
echo "No Answers Yet";
}
?>
</div>
<?php }
} else {
echo "0 results";
}
$conn->close();
?>
</div>
<script type='text/javascript'>
$(document).ready(function() {
$('.question').click(function(e) {
e.stopPropagation();
e.preventDefault();
$(this).parent().find('answ').slideDown('slow');
});
$(window).click(function(e) {
console.log( $(e.target) );
if( !$(e.target).is('answ') ){
$('answ').slideUp();
}
});
});
</script>
<script type='text/javascript'>
$(document).ready(function() {
$('.add').click(function(e) {
e.stopPropagation();
e.preventDefault();
$(this).parent().find('form').slideDown('slow');
$(this).parent().find('form textarea.addtext').focus();
$(this).hide();
});
$('form').click(function(e){
e.stopPropagation();
});
$(window).click(function(e) {
console.log( $(e.target) );
if( !$(e.target).is('form') ){
$('.add').show();
$('form').slideUp();
}
});
});
</script>
我希望代码清楚易懂。
使用PHP,您可以动态地在jquery上进行选择,只有当您为它编写委托函数时,它才能在动态元素上工作。
像这样编写你的函数,它将在
元素上工作$(document).on('click', '.question', function(e) {
e.stopPropagation();
e.preventDefault();
$(this).parent().find('answ').slideDown('slow');
});
相关文章:
- jQuery slideUp/Down奇怪事件
- 在开始时隐藏FX.slide内容,而不是在单击后隐藏
- 格式化Ember/drill-down/serialize/adapter的JSON项目
- Javascript Drop Down Box
- 当Swiper是多行时,Swiper Slide Active类
- 带有slideUp/Down和clearQueue的jQuery问题
- jQuery幻灯片Down&然后在计时器上向上滑动
- 如何限制 .key down JavaScript 事件
- jQuery - 如何同时应用 .animate() 和 .show('slide')
- Fancybox within Jquery Cycle Slide
- Toggle Ionic Slide Box”;确实继续”;
- Javascript Slide-In Onload
- JQuery Slide在其下方切换和DIV
- 如果 jquery slide切换元素被切换,则隐藏所有其他元素
- CSS + Jquery Slide在调整大小时切换菜单问题
- jquery 和 safari 7 - slide切换和淡入淡出切换不起作用
- jQuery slide sibling element
- 剑道编辑器 + show(“slide”) 在 Firefox 中不可编辑
- 谷歌地图不能在jQuery Slide Up/Down的fieldset中工作
- 如何为php选择数据库添加SLIDE DOWN/SLIDE UP功能