I want to be able to grab html5 attribute values and have them match the value and attribute name with the class - then hide on click.
我希望能够获取html5属性值,并让它们将值和属性名称与类匹配 - 然后单击隐藏。
for example data-table="sample11"
should hide class="sample11"
same for sample14
and any other attributes on this page
例如,data-table =“sample11”应该为sample14和此页面上的任何其他属性隐藏class =“sample11”
I was trying something like this but it isn't working for me - below is the way i am trying to do this - here is my fiddle http://jsfiddle.net/breezy/xq6epy39/
我正在尝试这样的东西,但它不适合我 - 下面是我试图这样做的方式 - 这是我的小提琴http://jsfiddle.net/breezy/xq6epy39/
Any help or guidance would be helpful. Thanks!
任何帮助或指导都会有所帮助。谢谢!
<div data-table="sample11">
<a href="#">when i click this 'hide this' in sample11 should hide</a>
</div>
<div class="sample11">
hide this
</div>
<div data-table="sample14">
<a href="#">when i click this 'hide this' in sample14 should hide</a>
</div>
<div class="sample14">
hide this
</div>
jQuery
jQuery的
var sample = $('div').data("table") === "11";
sample.click(function() {
$('.sample11').hide();
});
3 个解决方案
#1
4
try:
尝试:
$('div a').click(function(e) {
e.preventDefault();
$('.' + $(this).parent().attr('data-table')).toggle();//hide()//slideToggle()//fadeToggle()
});
http://jsfiddle.net/4Lor0md5/
#2
0
You can specify attributes using []
. There are several options using jquery selectors.
您可以使用[]指定属性。使用jquery选择器有几个选项。
var sample = $('div[data-table="11"]');
sample.click(function() {
$('.sample11').hide();
});
#3
0
you can use data attribute with jquery. I have modified your code
你可以使用jquery的data属性。我修改了你的代码
<div>
<a href="#" class="clickme" data-table=".sample14">when i click this 'hide this' in sample14 should hide</a>
</div>
<div class="sample14">
hide this
</div>
$(".clickme").click(function(){
alert($(this).data("table"));
$($(this).data("table")).hide();
})
in place of hide you can call toggle function for hide/unhide.
代替隐藏,您可以调用切换功能进行隐藏/取消隐藏。
#1
4
try:
尝试:
$('div a').click(function(e) {
e.preventDefault();
$('.' + $(this).parent().attr('data-table')).toggle();//hide()//slideToggle()//fadeToggle()
});
http://jsfiddle.net/4Lor0md5/
#2
0
You can specify attributes using []
. There are several options using jquery selectors.
您可以使用[]指定属性。使用jquery选择器有几个选项。
var sample = $('div[data-table="11"]');
sample.click(function() {
$('.sample11').hide();
});
#3
0
you can use data attribute with jquery. I have modified your code
你可以使用jquery的data属性。我修改了你的代码
<div>
<a href="#" class="clickme" data-table=".sample14">when i click this 'hide this' in sample14 should hide</a>
</div>
<div class="sample14">
hide this
</div>
$(".clickme").click(function(){
alert($(this).data("table"));
$($(this).data("table")).hide();
})
in place of hide you can call toggle function for hide/unhide.
代替隐藏,您可以调用切换功能进行隐藏/取消隐藏。