доступ к элементу href внутри li ul

Question

доступ к элементу href внутри li ul

0

У меня есть элементы DOM, как показано ниже.

Я хочу получить третий элемент "a href" внутри "ul class= 'dropdown-menu dropdown-caret" и изменить его класс "colorpick-btn" на "colorpick-btn selected" и установить класс первого "a href", элемент "colorpick-btn".

Я мог только придумать ниже, но я не могу заставить его работать

<script>
        $(document).ready(function () {

            $("#dropdown-menu dropdown-caret li a").removeClass('colorpick-btn').addClass('colorpick-btn selected');

        });
    </script>

chamara 15 нояб. 2013, в 05:38

Источник

0

нет элемента с идентификатором dropdown-menu
Arun P Johny 15 нояб. 2013, в 03:53
0

как бы вы узнали, что хотите изменить третий элемент li a
Arun P Johny 15 нояб. 2013, в 03:53
0

почему вы удаляете класс colorpick-btn и снова добавляете тот же класс одновременно?
Bhojendra Rauniyar 15 нояб. 2013, в 04:04

Показать ещё 1 комментарий

Теги:

javascript

jquery

html

css

dom

4 ответа

Ещё вопросы

нет элемента с идентификатором dropdown-menu
как бы вы узнали, что хотите изменить третий элемент li a
почему вы удаляете класс colorpick-btn и снова добавляете тот же класс одновременно?

Arun P Johny · Answer 1 · 2013-11-15T01-25-00.000Z

var $ul = $('.dropdown-colorpicker .dropdown-caret');
$ul.find('.colorpick-btn.selected').removeClass('selected');
$ul.find('.colorpick-btn').eq(2).addClass('selected');

Josh Crozier · Answer 2 · 2013-11-15T00-58-00.000Z

1

Используйте li:nth-child(3) a для первого и :first-child для второго.

Пример jsFiddle - он, похоже, делает то, что вы просите.

$(".dropdown-menu.dropdown-caret li:nth-child(3) a").addClass('selected');
$(".dropdown-menu.dropdown-caret li:first-child a").removeClass('selected');

Помимо этого, используйте .dropdown-menu.dropdown-caret а не #dropdown-menu dropdown-caret..

Josh Crozier 15 нояб. 2013, в 00:58

0

Вы / Автор забыл точку в селекторе.
TreeTree 15 нояб. 2013, в 03:56
0

@TreeTree Спасибо - сложно сказать со скриншотом. Я просто скопировал / вставил, затем изменил код, который использовал OP ... теперь должен работать.
Josh Crozier 15 нояб. 2013, в 04:01
0

Спасибо за ответ! по какой-то причине это все еще не работает. Я использую стороннюю тему в своем приложении. Поэтому я просто хотел изменить некоторые цветовые схемы без изменения стилей по умолчанию. wrapbootstrap.com/theme/ace-responsive-admin-template-WB0B30DGR .
chamara 15 нояб. 2013, в 04:26
0

когда я добавляю ваш код, DOM все равно выглядит
chamara 15 нояб. 2013, в 04:29
0

@chamara Вы используете $(document).ready , верно? Убедитесь, что у вас тоже есть jQuery .. он работает в демоверсии ..
Josh Crozier 15 нояб. 2013, в 04:56

Показать ещё 3 комментария

Chanuka Asanka · Answer 3 · 2013-11-15T01-49-00.000Z

вы можете просто использовать nth-child для этого. нет необходимости удалять существующий класс, после выбора элемента, который вы хотите, вы можете добавить новый класс, например, ниже

<script>
    $(document).ready(function () {

        $("#dropdown-menu dropdown-caret li:nth-child(3) a").addClass('selected');

    });
</script>

maiorano84 · Answer 4 · 2013-11-15T01-25-00.000Z

В вашей разметке у вас нет элементов с раскрывающимся меню id. Кроме того, выпадающее меню и dropdown-caret ссылаются на один и тот же элемент и не должны разделяться пробелом. Это должно помочь вам начать:

$(document).ready(function (){
    $(".dropdown-menu.dropdown-caret li:eq(2) a").removeClass('colorpick-btn').addClass('colorpick-btn selected');
});