Получить первый идентификатор ребенка из статьи с помощью только имени класса с помощью Jquery

Question

Получить первый идентификатор ребенка из статьи с помощью только имени класса с помощью Jquery

0

У меня такой код. Он должен показывать как горизонтальные кнопки с датами. Когда пользователь нажимает на одну из этих кнопок, поле расширяется, показывая изображения в нем.

Я пытаюсь получить первый идентификатор ребенка в статье с jquery, чтобы показать галерею с первым идентификатором ребенка без "_title" в конце. Но я не знаю.

Мой html:

<section id="gallery">
    <article class="gallery_date">
        <div id="1389848400_title">16-01-2014</div>
        <div class="gallery_items" id="1389848400">
            <a href="content/uploads/261689_10150238069156283_4353481_n.jpg">261689_10150238069156283_4353481_n.jpg</a><br>
            <a href="content/uploads/IMG_4667.jpg">IMG_4667.jpg</a><br>
            <a href="content/uploads/millenium2.png">millenium2.png</a><br>
        </div>
    </article>
    <article class="gallery_date">
        <div id="1389762000_title">15-01-2014</div>
        <div class="gallery_items" id="1389762000">
            <a href="content/uploads/IMG_4661.jpg">IMG_4661.jpg</a><br>
        </div>
    </article>
    <article class="gallery_date">
        <div id="1389675600_title">14-01-2014</div>
        <div class="gallery_items" id="1389675600">
            <a href="content/uploads/bcn.png">bcn.png</a><br>
            <a href="content/uploads/logoenmedio.png">logoenmedio.png</a><br>       
        </div>
    </article>
</section>

Мой JQuery:

$().ready(function() {
    $(".gallery_date").click(function(event) {
        console.log($(".gallery_date:first-child").attr("id"));
    });
});

благодаря

codiaf 17 янв. 2014, в 17:26

Источник

0

$(this).find(":first-child").attr("id").split('_').shift() и использование $(document).ready(function() {...});
A. Wolff 17 янв. 2014, в 15:32

Теги:

javascript

jquery

html

5 ответов

1

первый идентификатор ребенка без "_title".

Вы можете использовать .replace() для удаления '_title' или вы можете использовать .split()

$(document).ready(function() {
    $(".gallery_date").click(function(event) {
        var id = $(this).children().first().attr("id")
        console.log(id.replace('_title',''));

        console.log(id.split("_")[0]);
    });
});

Satpal 17 янв. 2014, в 13:20

0

$(".gallery_date").click(function(event) {
    console.log($(this).children().first().attr("id"));
});

Jonathon 17 янв. 2014, в 14:01

0

Если ваш html структурирован так, как он есть, вы также можете просто использовать метод.next(), чтобы получить div галереи gallery_items, как это, поэтому вам не нужно беспокоиться о получении идентификаторов и возврате элементов DOM:

$(document).ready(function() {
    $(".gallery_date").click(function() {
        $(this).next(".gallery_items").slideDown();
    });
});

fostermm 17 янв. 2014, в 13:56

0

Попробуй это:

$(document).ready(function() {
    $(".gallery_date").click(function(event) {
        console.log($(this).find('.gallery_items:first-child').attr("id"));
    });
});

Felix 17 янв. 2014, в 12:43

Ещё вопросы

$(this).find(":first-child").attr("id").split('_').shift() и использование $(document).ready(function() {...});

cookie monster · Accepted Answer · 2014-01-17T13-22-00.000Z

"Я пытаюсь получить первый идентификатор ребенка в статье с jquery, чтобы показать gallery_items с первым идентификатором ребенка без "_title" в конце".

Сделай это:

$(this).children().first().prop("id").split("_")[0];

Или без jQuery, так что это не так много:

this.children[0].id.split("_")[0];

Но если это единственная потребность в идентификаторе, вы можете просто выбрать элемент с .children() своим классом:

$(this).children(".gallery_items")