Question

我有2个名单：

·“来源”选择器; ·所选来源的“内容”;

我需要知道如何将源列表中的每个项目转换为按钮，仅在单击时显示其内容，并在选中时保持突出显示，就像iTunes智能播放列表（例如）一样。

有可能吗？

Answer 1

你可以这样做（似乎jQuery在这里没有正常工作。请试试你的系统）

，您可能会看到jsFiddle

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" </script>

<script src="src/jquery.cookie.js"></script>

<script type="text/javascript">
jQuery(function( $ ){

// Check if alert has been closed
if( $.cookie('alert-box') === 'closed' ){

    $('.alert').hide();

}

 // Grab your button (based on your posted html)
$('.close').click(function( e ){

    // Do not perform default action when button is clicked
    e.preventDefault();

    /* If you just want the cookie for a session don't provide an expires
     Set the path as root, so the cookie will be valid across the whole site     */
    $.cookie('alert-box', 'closed', { expire 7, path: '/' });

});

});
</script>

<!-- Body Markup -->
<div class="alert alert-info fade in">            
        <button type="button" class="close" data-dismiss="alert">×</button>
        <strong> ALERT BODY</strong>
</div>

WITH HyperGroup AS (
   select
      'Group Type' ::text AS mm_type
      ,'Group Name' ::text AS mm_group
), number1 AS (
   SELECT
      SUM(fl.flower1 +  fl.flower2 + fl.flower3 - fl.flower4) AS season
      ,'Group Type' ::text AS mm_type
      ,'Group Name' ::text AS mm_group
   FROM (x_flwr1 as fl INNER JOIN x_flwr2 as grass
   ON REPLACE(fl.flower5, ' ', '') = grass.flower6
   AND TO_DATE(fl.flower7, 'YYYY/MM/DD') >= TO_DATE(CONCAT(grass.flower8, grass.flower9), 'YYYY/MM/DD')
   AND fl.flower7 = (
      SELECT MIN(fl2.flower7) FROM x_flwr1 as fl2
      WHERE TO_DATE(fl.flower7, 'YYYY/MM/DD') >= TO_DATE(CONCAT(grass.flower8, grass.flower9), 'YYYY/MM/DD')
      AND  REPLACE(fl.flower5, ' ', '') = grass.flower6
      )
   )
   WHERE
      fl.flower10 != 'Flower10 Value'
   AND fl.flower10 NOT LIKE 'M%'
   AND fl.flower11 != 'Flower11 Value'
   AND fl.flower12 != 0
   AND fl.flower3 > 0
), number2 AS (
      SELECT
         SUM(fl.flower3 - fl.flower4) AS season
         ,'Group Type' ::text AS mm_type
         ,'Group Name' ::text AS mm_group
      FROM (x_flwr1 as fl INNER JOIN x_flwr2 as grass
      ON REPLACE(fl.flower5, ' ', '') = grass.flower6
      AND TO_DATE(fl.flower7, 'YYYY/MM/DD') >= TO_DATE(CONCAT(grass.flower8, grass.flower9), 'YYYY/MM/DD')
      AND fl.flower7 = (
         SELECT MIN(fl2.flower7) FROM x_flwr1 as fl2
         WHERE TO_DATE(fl.flower7, 'YYYY/MM/DD') >= TO_DATE(CONCAT(grass.flower8, grass.flower9), 'YYYY/MM/DD')
         AND  REPLACE(fl.flower5, ' ', '') = grass.flower6
      ))
      WHERE
          fl.flower10 != 'Flower10 Value'
      AND fl.flower10 NOT LIKE 'M%'
      AND fl.flower11 != 'Flower11 Value'
      AND fl.flower12 != 0
      AND fl.flower3 > 0
)
SELECT
   count(*)
FROM
 ((HyperGroup LEFT OUTER JOIN number1 ON HyperGroup.mm_type = number1.mm_type AND HyperGroup.mm_group = number1.mm_group)
   LEFT OUTER JOIN number2 ON HyperGroup.mm_type = number2.mm_type AND HyperGroup.mm_group = number2.mm_group)

$(document).ready(function(){
    $("ul#tabs li").click(function(e){
        if (!$(this).hasClass("active")) {
            var tabNum = $(this).index();
            var nthChild = tabNum+1;
            $("ul#tabs li.active").removeClass("active");
            $(this).addClass("active");
            $("ul#tab li.active").removeClass("active");
            $("ul#tab li:nth-child("+nthChild+")").addClass("active");
        }
    });
});

如何使列表项显示/隐藏DIV列表或DIV的指定项？

1 个答案: