我有来自数据库的结果页面,在每一行上我都有显示/隐藏按钮,应该显示/隐藏带有 $title 的容器....
我尝试使用 jquery 但它不起作用:(
<div class="container">
<div class="show_hide_button_<? echo $article_id_tmp; ?>"><a href="#">show/hide</a></div>
<div class="show_hide_container_<? echo $article_id_tmp; ?>">
</div>
</div>
<script type="text/javascript">
var div_id = '$article_id_tmp';
div_id_b+='.show_hide_button_'+ 'div_id';
div_id_c+='.show_hide_container_'+ 'div_id';
$(function(){
$('div_id_b').click(function(){
$('div_id_c').toggle();
});
});
谢谢
最佳答案
您的变量是变量,而不是字符串,因此您不应将它们括在空格内:
var div_id = '$article_id_tmp';
div_id_b+='.show_hide_button_'+ 'div_id';
div_id_c+='.show_hide_container_'+ 'div_id';
$(function(){
$(div_id_b).click(function(){
$(div_id_c).toggle();
});
});
此外,还需要在JS中echo
$article_id_tmp
:
var div_id = '<?php echo $article_id_tmp ?>';
div_id_b+='.show_hide_button_'+ 'div_id';
div_id_c+='.show_hide_container_'+ 'div_id';
$(function(){
$(div_id_b).click(function(){
$(div_id_c).toggle();
});
});
此外,类
通常用于对页面上的相似元素进行分组;但是,您为每个元素分配了不同的类。为了保持一致性,您可能需要考虑使用“id”而不是类,或者更好的是,如下所示:
<div class="container">
<div class="show_hide_button"><a href="#">show/hide</a></div>
<div class="container">
</div>
</div>
$('.show_hide_button').click(function () {
$(this).next('.container').toggle();
});
您当然可以删除container
类,然后只使用$(this).next().toggle()
关于jquery切换 "variable"div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7387675/