Question

好的，我有从数据库中选择的动态类别，我将它们放在选择下拉列表中，每个类别都有多篇文章，首先，我展示所有文章问题是，我想选择一个类别，我只显示与该类别相关的文章并隐藏其余部分，因为我把文章放在div中，每个div都有自己的相关类别类。我坚持如何隐藏和展示他们这是我的代码，例如：

 <select  id="selectleft" >
     <option value="categorie">categorie</option></center>
         <option value="categorie1">sport</option>
         <option value="categorie2">movies</option>
         <option value="categorie3">news</option>


        </select>

并且文章显示如下

<div class="categorie1>article 1 </div>
<div class="categorie1>article 2 </div>
<div class="categorie2>article 1 </div>
<div class="categorie2>article 2 </div
<div class="categorie3>article 3 </div>
<div class="categorie3>article 3 </div

好吧我想要例如，如果我选择了categorie1，所有带有类别类别1的div都会获得showe并且其余部分会被隐藏

Answer 1

这可能会有所帮助;）

＆＃13;

onBindViewHolder

＆＃13;

//Show selected / unselected checkbox based on isSelected Value
//hmSelection is the HashMap that maintains the list of items selected in the adapter. 
    if((hmSelection.containsKey(holder.strSelectedItemName) && hmSelection.get(holder.strSelectedItemName))
            || lsSelectedList != null && lsSelectedList.contains(holder.strSelectedItemName)) {
        if(!hmSelection.containsKey(holder.strSelectedItemName))
            hmSelection.put(holder.strSelectedItemName, true);
        holder.cbCheckBox.setImageResource(R.drawable.checkedtick_checkbox);
    } else {
        if(!hmSelection.containsKey(holder.strSelectedItemName))
            hmSelection.put(holder.strSelectedItemName, false);
        holder.cbCheckBox.setImageResource(R.drawable.ic_checkbox_unselected);
    }

＆＃13;

Answer 2

您可以使用change()事件处理程序

$('#selectleft').change(function() {
  // hide all div
  $('.categorie').hide();
  // or hide only the rest by
  // $('.categorie').not('.' + this.value).hide();

  // show div based on selected option
  $('.' + this.value).show();
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="selectleft">
  <option value="categorie">categorie</option>
  <option value="categorie1">sport</option>
  <option value="categorie2">movies</option>
  <option value="categorie3">news</option>
</select>

<div class="categorie categorie1">article 1</div>
<div class="categorie categorie1">article 2</div>
<div class="categorie categorie2">article 1</div>
<div class="categorie categorie2">article 2</div>
<div class="categorie categorie3">article 3</div>
<div class="categorie categorie3">article 3</div>

Answer 3

根据你所说的，我制作了代码。请查看以下代码段。

＆＃13;

$('#selectleft').change(function()
{
  $('.article').addClass('deactive');
   var x = $('#selectleft').val();
   $('.'+x).removeClass('deactive');
});

＆＃13;

.deactive{display:none;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h1> select cotegories</h1>
<select  id="selectleft" >
     <option value="categorie">categorie</option>
         <option value="categorie1">sport</option>
         <option value="categorie2">movies</option>
         <option value="categorie3">news</option>


        </select>

<div class="article deactive categorie1">article 1 </div>
<div class="article deactive categorie1">article 2 </div>
<div class="article deactive categorie2">article 3 </div>
<div class="article deactive categorie2">article 4 </div>
<div class="article deactive categorie3">article 5 </div>
<div class="article deactive categorie3">article 6 </div>

＆＃13;

Answer 4

<script>
$('#selectleft').change(function()
{
   var x = $('#select').val();
   $('.x').hide();
});
</script>

隐藏并显示选择

4 个答案: