1

dijit.InlineEditBoxを使用しようとしています。dojoドキュメントの例を使用して、次のコードをHTMLに配置しました。

<script type="text/javascript">
    dojo.require("dijit.InlineEditBox");
    dojo.require("dojo.parser");
    dojo.require("dijit.form.TextBox");

    function editableHeaderOnChange(id, arg){
        alert("details changed with id " + id + " and arguments "+arg);
    }
</script>

...
<span id="myText" dojoType="dijit.InlineEditBox" onChange="editableHeaderOnChange(this.id,arguments[0])"
autoSave="true" title="My Text">click to edit me</span>

ツンドラのテーマを使用しています。動作しますが、見た目はあまり良くありません。ウィジェットには独自のスタイルがあり、私のCSSには適合しません。問題の原因を突き止めるためにfirebugを使用しました。ウィジェットは多くのネストされたdiv/span要素を作成し、それぞれに独自のスタイル(firebugの要素スタイル)があります。

<span
id="dijit__InlineEditor_0"
class="dijitReset dijitInline"
style="margin: 0px; position: absolute; visibility: hidden; display: block; opacity: 0;" ...>

<input type="text" autocomplete="off" 
class="dijit dijitReset dijitLeft dijitTextBox"
id="dijit_form_TextBox_0"
style="line-height: 20px; font-weight: 400; font-family: Trebuchet MS,Helvetica,Arial,Verdana; font-size: 14.5167px; font-style: normal; width: 100%;">
...>
</span></span>

(関連する部分のみを表示しています...)

改行に分割されない目的のビジュアルを取得するには、dijit_form_TextBox_0 **の幅を50%に変更し、dijit__InlineEditor_0の位置を次のように表示する必要があります。inline**;

またはすべての位置を変更します(私のレイアウトのほとんどはフロートしているので、位置:絶対は適合しません)

もちろん、element.styleが優先されるため、cssでこれらのスパン要素をアドレス指定してプロパティを変更することはできません。

このシステムのロジックがわかりません...dijitが要素内で直接スタイルを生成するのはなぜですか?これらのプロパティを変更するにはどうすればよいですか?

ありがとうトム

4

1 に答える 1

0

これにより、Tundra と同様に、独自のテーマを作成するために必要なすべてが提供されます。

http://docs.dojocampus.org/dijit-themes

追加した:

Dijit は、幅や高さなどのインライン スタイルを使用して、独自の内部要素の適切な設定を決定しようとします。だからあなたは書くことができます

 <span style="width:200px" id="myText" dojoType="dijit.InlineEditBox" onChange="editableHeaderOnChange(this.id,arguments[0])" autoSave="true" title="My Text">click to edit me</span> 

そして、それが機能するかどうかを確認してください。フォントや行の高さなどについてはわかりませんが、それはテーマ次第であるように思えます。なんらかの理由で、それらをインラインスタイルにコピーするかもしれません。それを変更してみて、何が起こるか見てみましょう。

私も物事の論理の専門家ではありません。私はそれで数回手を出しましたが、ある程度成功しました。私が言えることは、それは不可能ではないということだけです。助けが悪くてごめんなさい。

于 2010-03-24T16:13:06.230 に答える