2010-11-09 15 views
9

Ben şekillendirme amacıyla aşağıda Widget'a birden sınıfları eklemek istiyorum:Dojo küçük aracına nasıl sınıf ekleyebilirim?

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

Bunu başarmak istiyorum nasıl?

<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> 

cevap

9
dojo.addClass(filteringSelect.domNode, "yourClass"); 

Bu aynı zamanda çiftleri eklenmez, böylece bir DOM düğümü zaten CSS sınıfı olarak "youClass" içeren durumları ele alır:

İşte gerçek html 'dir. dojo ayrıca CSS sınıf yönetimini dojo.removeClass() ve dojo.toggleClass() ile işlemek için başka yöntemler de sağlar.

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

+0

yüzden dojo.addClass olurdu (filteringSelect.test, "ClassName"); veya giriş etiketi olur mu? – Amen

+0

hayır, domNode özelliği HTML'nizdeki gerçek DOM düğümüne bir başvuru sağladığından, filteringSelect.domNode yapmalısınız. filteringSelect.test bir NPE ile sonuçlanır. – linusthe3rd

+0

Ayrıca, filteringSelect, bir grup dijit API yöntemi sağlayan bir dijit widget'ına bir başvuru sağlar; gerçek HTML DOM öğesi değil. – linusthe3rd

1

Daha çalışma yöntemleri:

(1) prosedürel versiyonu, komut dosyasından pencere öğesi oluşturma:

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

(2) basitçe "sınıf" özelliği ayarlarsanız, dijit/_WidgetBase.js_setClassAttr ayarlayıcı işlevini, tam olarak istediğinizi yapacak şekilde çağırır:

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

(3) burada, widget dojosu özelliklerini ayarlayabilirsiniz:

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