问grab元素id - jquery
EN

Stack Overflow用户

提问于 2010-01-05 04:59:22

回答 3查看 1.4K关注 0票数 0

我正在寻找一种可以从我的页面中获取元素id的方法，如下所示：

<div id="events"> 
    <div id="event_1765" class="type_automotive start_125x125 color_Black"> 
        <h3>Leftlane News</h3> 
    </div> 
</div>

我希望获得id=“事件”，但我需要它在此脚本中的事件是：

    $("input.type_check").click(function() {
        if($(this).is(':checked')) {
            $("#events div."+$(this).attr('id')).removeClass('type_hidden');
            $("#events div").not(".type_hidden, .start_hidden, .color_hidden").css("display","block");
        } else {
            $("#events div."+$(this).attr('id')).addClass('type_hidden');
            $("#events div."+$(this).attr('id')).css("display","none");
        }
    });

因此，换句话说，我想用动态获取html页面上的id元素的代码来替换jquery脚本中的'events‘。

jquery

语音识别特惠，低至14.9元！

提供业界非常具有性价比的语音识别服务，超高识别准确率，适用多场景

回答 3

Stack Overflow用户

回答已采纳

发布于 2010-01-05 06:33:54

首先，当你还在放一个类的时候，不要使用css()来隐藏它们。你可以在你的CSS中轻松地做到这一点：

div.type_hidden { display: none; }

或者干脆就不用了。

$("input.type_check").click(function() {
  $("div." + this.id).toggle($(this).is(":checked"));
});

这一点：

获取所单击复选框的ID属性(例如，在类选择器中使用"type_automotive");
uses来隐藏/显示该类的div；而
检查复选框状态以查看是否需要隐藏或显示它们。

不需要"type_hidden“类或css("display", "none") (在使用jQuery效果之前，您不应该这样做)。

注意：这一切都假设(从你的站点)：

<input name="type[]" type="checkbox" id="type_automotive"
  value="automotive" class="type_check" checked="checked" />

和

<div id="events"> 
  <div id="event_1768" class="type_automotive start_300x250 color_Black"> 
    <h3>Autoblog</h3> 
  </div> 
</div>

票数 1

Stack Overflow用户

发布于 2010-01-05 05:01:56

在这种情况下，您需要为该div设置一些“选择器”。您如何定位它？它总是在其他“独特”事物中的第一个div吗？它有一个特殊的类吗？你需要一些独特的方法来定位它。

票数 0

Stack Overflow用户

发布于 2010-01-05 05:42:27

我不确定我是否理解了这个问题，但我认为您希望在检查输入时隐藏相应的div。另外，看看你的html- -每个页面应该只有一个唯一的id。你应该把events“id=”改成class="events“。一旦你这样做了，我想你需要的javascript是：

$("input.type_check").click(function() {
    if($(this).is(':checked')) {
        $surroundingDiv = $("div." + $(this).attr('id')).parent().removeClass('type_hidden');
        $('div.events').not(".type_hidden, .start_hidden, .color_hidden").css("display","block");
    } else {
        $("div."+$(this).attr('id')).parent().addClass('type_hidden');
        $("div."+$(this).attr('id')).parent().css("display","none");
    }
});