Nano Hash - криптовалюты, майнинг, программирование

удаление родительских классов в Backbone Marionette CompositeViews

Привет, я пытаюсь сделать простой материал (пожалуйста, примите во внимание, что я новичок в Marionette + CSS + jquery). Что я пытаюсь сделать, так это: у меня есть 2 div, которые при загрузке страницы имеют определенный стиль класса (неактивный стиль красного цвета), когда пользователь нажимает на один из них, я удаляю «неактивный» класс и вставьте стиль класса «активный», зеленый цвет. Я использую Marionnette CompositeView для рендеринга своих элементов, проблема в том, что «неактивный» класс удален, но активный класс не добавлен, я упрощаю свою проблему:

<script id="ulTemplate" type="text/template">
    <ul class="ulItem">
    </ul>
</script>
<script id="internal-Item" type="text/template">    
    <div class="<%= className %>"></div>
</script>    
<div class="container">
</div>

Мой JS/CSS/код Причина, по которой я устанавливаю фон для родительских элементов (дополнительный div CompositeView добавляется) потому, что в конечном результате мой div должен иметь изображение. Это очень упрощенный пример, в конце концов он станет более сложным элементом, но пока я застрял на первом шаге (я думаю, что это более легкий шаг). Пожалуйста, помогите мне здесь, я милостив с вашими комментариями, снова новичок в областях.

jquery marionette
24.05.2013

Ответы:


1

На самом деле ваш код работает, и класс изменяется, но проблема в том, что вы меняете класс с «internal-Item-inactive» на «switcher-item-background-active» в своей функции addClasstoParentElement. и этот класс не тот, который вы передаете в качестве параметра, также не определен в вашем css.

внесение этого изменения в эту функцию помогло.

       addClasstoParentElement: function (options) {
           if (!options.element.parent().hasClass(options.className)) {
                options.element.parent().addClass(options.className); // "internal-Item-active"
           }

пожалуйста, проверьте эту ссылку http://jsfiddle.net/xbBEy/64/

Я добавил код и объяснение к нему.

        this.removeClassfromParentElement({element:this.ui.div1, className: "internal-Item-inactive"});
            this.addClasstoParentElement({element: this.ui.div1, className: "internal-Item-active"}); 
            // and here we make the second div Inactive, 
            // this referst to this specific Itemview that indeed contains div1 but does not contains div2 so you cannot use   
           // this.ui.div2 as it will be undefined. thats why is find it using    $('.did2') its  that is traversing the entire dom to find it.
    this.removeClassfromParentElement({element:$('.div2').closest('div'), className: "internal-Item-active"});
            this.addClasstoParentElement({element: $('.div2').closest('div'), className: "internal-Item-inactive"});
24.05.2013
  • Спасибо за ответ, вы были правы, моя ошибка, я изменил код (вы можете видеть в ссылке, которую я разместил), но все же при попытке удалить класс из другого div, который стал «активным», класс не удаляется, а получает в конце с двумя div с одним и тем же классом (оба активны - зеленый цвет), спасибо за вашу помощь 25.05.2013
  • Спасибо, это то, чего мне не хватало, большое спасибо, теперь, после просмотра кода, у меня возник вопрос, это правильный путь?, может быть, мне нужен другой объект, который будет управлять изменениями (в моем случае CompositeView, может быть, объект Объект ItemView не должен этого делать, как вы думаете. 25.05.2013
  • Я полностью согласен с вами, это неправильный путь, я думаю, вам нужно запустить событие в вашем itemView, CompositeView должен обрабатывать это событие, у меня нет фона вашего проекта, поэтому я не могу дать вам лучший совет, чем обрабатывать эти изменения, используя события с компонентом eventAgregator марионетки. 26.05.2013
    • Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..