jquery使用單選按鈕過濾內容（顯示/隱藏）

嘿，我正在尋找一個非常簡單的jQuery代碼，當某個單選按鈕被選中時顯示一個div，並且如果該單選按鈕被「取消選擇」單選按鈕值。jquery使用單選按鈕過濾內容（顯示/隱藏）

我想通了如何使它與單選按鈕工作了一個過濾器，但我想工作了兩個過濾器說

在此基礎上型它屬於
基於沒有的........ 量

這裏是一個適用於第一濾波器（類型）的代碼：

<script> 
    var $filters = $("input:radio[name='type']"); 


var $categoryContent = $('#mainhide .mainresultbox'); 
var $errorMessage = $('#errorMessage'); 
$filters.click(function() { 
    // if any of the radio buttons for brand are checked, you want to show div's containing their value, and you want to hide all the rest. 
    $categoryContent.hide(); 
    var $selectedFilters = $filters.filter(':checked'); 
    if ($selectedFilters.length > 0) { 
     $errorMessage.hide(); 
     $selectedFilters.each(function (i, el) { 
      $categoryContent.filter(':contains(' + el.value + ')').show(); 
     }); 
    } else { 
     $errorMessage.show(); 
    } 

}); 
</script>

這裏是單選按鈕的HTML。

<ul> 
    <li><label for="cdg"><input type="radio" id="cdg" name="type" value="brand1"> brand1</label></li> 
    <li><label for="cdh"><input type="radio" id="cdh" name="type" value="brand2"> brand1</label></li> 
    <li><label for="cdi"><input type="radio" id="cdi" name="type" value="brand3"> brand1</label></li> 
</ul> 

<ul> 
    <li><label for="cdj"><input type="radio" id="cdj" name="quantity" value="10">10</label></li> 
    <li><label for="cdk"><input type="radio" id="cdk" name="quantity" value="20">20</label></li> 
    <li><label for="cdl"><input type="radio" id="cdl" name="quantity" value="30">30</label></li> 
</ul>

這裏是div及其內容

<div id="#mainhide"> 
    <div>brand1 in stock - 10</div> 
    <div>brand1 in stock - 20</div> 
    <div>brand1 in stock - 30</div> 
</div> 
<div id="errorMessage">reset all fliters</div>

我怎樣才能讓這兩個過濾器工作，任何一個可以幫助我....

謝謝納雷什Kamireddy

來源

2013-05-29 user2361114

你的代碼是weird.you已使用的名稱爲FLI過濾複選框，但在HTML代碼中你所提到的沒有這樣的複選框的元素。 –

我編輯過的問題現在可以查看@ Milind Anantwar – user2361114

：根據您提到的兩個過濾器，您想要執行的活動是什麼 –

我不確定你到底想要什麼，但你可以看看這個：

而且其<div id="mainhide">不<div id="#mainhide">

http://jsfiddle.net/yyCSQ/3/

來源

2013-05-29 09:31:27

不能在ID使用特殊字符，ID應該遵循有效的規則。您使用<div id="#mainhide">.這是無效的ID名稱

使用：<div id="mainhide">

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

來源

2013-05-29 09:39:32

您可以重新過濾像你這樣的屬性選擇做：

var $selectedFilters = $filters.filter(':checked').filter('[value="10"]';

我還將使用$(document).ready(function(){[your code here]});而不是在頁面仍在加載時大量加載JS。而且我也建議您不要在其他人的建議中使用#。

JQuery documentation

來源

2013-05-29 09:45:29 TecHunter

回答

相關問題