javascript - googleapis - dojo toolkit vs angular



Comment ajouter une classe à un widget dojo? (2)

Je souhaite ajouter plusieurs classes au widget ci-dessous à des fins de style:

var filteringSelect = new dijit.form.FilteringSelect({
    id: "test",
},
"test");

Comment pourrais-je accomplir cela?

Voici le html réel:

 <div tabindex="-1" wairole="combobox" dojoattachpoint="comboNode" dojoattachevent="onmouseenter:_onMouse,onmouseleave:_onMouse,onmousedown:_onMouse" id="widget_test" class="dijit dijitReset dijitInlineTable dijitLeft dijitComboBox" role="combobox" widgetid="test">
        <div style="overflow: hidden;">
            <div dojoattachevent="onmousedown:_onArrowMouseDown,onmouseup:_onMouse,onmouseenter:_onMouse,onmouseleave:_onMouse" wairole="presentation" dojoattachpoint="downArrowNode" class="dijitReset dijitRight dijitButtonNode dijitArrowButton dijitDownArrowButton" role="presentation">
                <div class="dijitArrowButtonInner">
                    &thinsp;
                </div>
                <div class="dijitArrowButtonChar"></div>
            </div>
            <div class="dijitReset dijitValidationIcon">
                <br>
            </div>
            <div class="dijitReset dijitValidationIconText">
                Χ
            </div>
            <div class="dijitReset dijitInputField">
                <input type="text" waistate="haspopup-true,autocomplete-list" wairole="textbox" dojoattachpoint="textbox,focusNode" dojoattachevent="onkeypress:_onKeyPress,compositionend" class="dijitReset" autocomplete="off" role="textbox" aria-haspopup="true" aria-autocomplete="list" aria-invalid="false" id="test" tabindex="0" aria-required="true" value="United States"><input type="text" style="display: none;" name="">
            </div>
        </div>
    </div>

https://src-bin.com


Answer #1

Autres méthodes de travail:

(1) La version procédurale, créant le widget à partir du script:

var filteringSelect = new dijit.form.FilteringSelect({
    id: "test",
    class: "myClassName"
},
"test");

(2) Si vous définissez simplement l'attribut "class", il appellera dijit/_WidgetBase.js la fonction setter _setClassAttr , qui fait exactement ce que vous voulez:

<div data-dojo-type="dijit/form/SomeThing" class="myClassName"></div>

(3) Vous pouvez définir les propriétés de dojo du widget, comme ici:

<div data-dojo-type="dijit/form/SomeThing" data-dojo-props="class: 'myClassName'"></div>

Answer #2
dojo.addClass(filteringSelect.domNode, "yourClass");

Cela gère également les situations dans lesquelles un noeud DOM contient déjà "youClass" en tant que classe CSS afin que les doublons ne soient pas ajoutés. dojo fournit également d'autres méthodes pour gérer la gestion des classes CSS avec dojo.removeClass () et dojo.toggleClass ().

http://staging.dojotoolkit.org/reference-guide/dojo/addClass.html





dojo