Question

事实：我对jQuery并不是那么好。

问题：

我有一个包含动态渲染单选按钮的表单。单击单选按钮时，我想要一个div来显示文本说明。在“隐藏”div中，我想要一个按钮或链接来“关闭”div。我有一组27个单选按钮，点击每个WORKS完全正常它显示正确的div我可以点击另一个单选按钮，它切换到下一个隐藏的div，除了我不能隐藏它们之后！但是，我可以隐藏第一个单选按钮的div，但是我无法隐藏任何其他26，该按钮在这些div中没有做任何事情。

以下是我的单选按钮的代码：

 $categoryQuery = "SELECT * FROM blah, blah";
 $categoryResult = mysqli_query($link, $categoryQuery );

                    while($row = mysqli_fetch_array($categoryResult)){

       $cat_id = $row['att_cat_id'];
       $category = $row['att_cat_name'];

 echo "<input type='radio' name='AttorneyCategory[]' value='$cat_id'> $category<br />";

隐藏div的代码（从我的db创建）：

 $categoryhelpQuery = "SELECT * FROM blah blah";
 $categoryhelpResult = mysqli_query($link, $categoryhelpQuery );

                    while($row = mysqli_fetch_array($categoryhelpResult)){

       $cat_id = $row['att_cat_id'];
       $category = $row['att_cat_name'];
       $category_description = $row['att_cat_description'];

 echo "<div id='blk-$cat_id' class='toHide'>";
 echo "<strong><em><center>Attorney Search Help Center</center></em></strong><button           id='hidr'>Hide</button><br />";
 echo "<strong>$category:</strong>&nbsp;&nbsp;$category_description";
 echo "</div>";

这是我的jQuery代码：

 <script type="text/javascript"   src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

  <script type="text/javascript">
 $(function() {
     $("[name='AttorneyCategory[]']").click(function(){
        $('.toHide').hide();
        $("#blk-"+$(this).val()).show();
     });


 });

  $("#hidr").click(function () {
  $('.toHide').hide(1000);
 });


 </script>

任何帮助都会很棒。

Answer 1

第一件事：它看起来像你的

$("#hidr").click(function () {
$('.toHide').hide(1000);
});

在你的

之外

$(function(){
   // this part
});

我相信你知道，在页面准备好被访问之后，jQuery会运行该函数内的所有内容。现在我认为jQuery正在寻找“#hidr”而没有找到任何东西，因为这个代码会尽快运行。可能在浏览器制作任何“#hidr”之前

但是等等！还有更多。仔细看看

 <button id='hidr'>Hide</button>

你正在使用id！ :)只有在你的页面上有任何给定id的东西。尝试使用类来代替。这样你就可以将.click事件附加到每个$（“。hidr”）

然后，只需引用父母就可以使它全部消失。像这样：

 $(".hidr").click(function () {
   $(this).parent().hide(1000);
 });

祝你的律师页好运！

Answer 2

您可以使用.toggle吗？

而不是使用.hide（1000）

使用jQuery隐藏带动态单选按钮的Div？

2 个答案: