Jquery選擇器名稱前綴在分區

在我的HTML代碼中，我有4個不同視圖的按鈕1,2,3和4。我命名爲一些div：Jquery選擇器名稱前綴在分區

sheet(button id)+some string

所以每當我按鈕點擊2猜想，我想所有id=sheet2abc，id=sheet2xyz等方面的分歧變得可見，爲剩餘部分（即1,3和4） dispaly:none屬性應該設置爲像sheet1abc,sheet3abc等

如何通過jQuery選擇器來做到這一點？

來源

2011-06-13 R1234

沒有足夠的 – 2011-06-13 11:05:51

，你能否告訴我們清楚你已經嘗試過？ – 2011-06-13 11:07:49

按鈕：<a href="1" class="button">button 1</a>等

表：<div id="sheet1" class="sheet">sheet 1</div>等

的jQuery：

$('.button').click(function(event){ 

    event.preventDefault(); 

    $('.sheet').hide(); 
    $('#sheet'+$(this).attr('href')).show(); 

}

下一次令你的問題更加清晰。

來源

2011-06-13 11:08:50 Kokos

這不是正確的解決方案，因爲它只能提供您提供的確切名稱的div。 – Alp 2011-06-13 11:10:30

我想你想在jQuery選擇器中使用通配符。

這說明每div其id開始用「工作表Sheet1」：

$('div[id^=sheet1]').each(function() { 
    $(this).show(); 
});

而這個隱藏其他：

$('div[id^=sheet]:not([id^=sheet1])').each(function() { 
    $(this).hide(); 
});

我創建a fiddle to demonstrate that。

來源

2011-06-13 11:09:20 Alp

可以過濾，如：

$('button').click(function() { 
    var $button = $(this); 
    $('div[id^=sheet]').each(function() { 
     if((new RegExp("^sheet" + $button.data('id') + ".*$")).test($(this).attr('id'))) { 
      $(this).show(); 
     } else { 
      $(this).hide(); 
     } 
    }); 
});

然後碼按鈕，如：

<button data-id="1">1</button>

來源

2011-06-13 11:12:45 pimvdb

KISS。本質：

$('[id^=sheet]').hide(); 
$('[id^=sheet'+num+']').show(); // num is a relevant value, see the example

工作例如：http://jsfiddle.net/j4TzA/

來源

2011-06-13 11:13:53 davin

它的工作.. :)。非常感謝！ – R1234 2011-06-13 11:32:26

@Rohan，很高興 – davin 2011-06-13 11:33:56

@達文 - 你能幫我解答一下嗎？ – R1234 2011-06-13 12:18:06

Jquery選擇器名稱前綴在分區

回答

相關問題