JavaScript+dojoのコードに問題があります。特定の高さと文字列を指定したウィジェットを作成しています。文字列がオーバーフローした場合、ウィジェットは最後に省略記号を付けてその文字列を表示します。このウィジェットを使用する方法は2つあります。実際の文字列をフィードするか、テキストファイルへのURLを指定することができます。
問題は、実際の文字列をウィジェットにフィードすると失敗しますが、URLを指定すると完全に機能することです。コードは次のとおりです。
define(["dojo/_base/declare","dijit/_WidgetBase", "dijit/_TemplatedMixin", "dojo/text!./template/template.html", "dojo/_base/xhr", "dojo/dom-style", "dojo/_base/lang"],
function(declare, WidgetBase, TemplatedMixin, template, xhr, domStyle, lang){
return declare([WidgetBase, TemplatedMixin], {
templateString: template,
textSrc: "",
content: "",
height: 100,
ellipsis: "...",
endPoint: "Read more...",
postCreate: function(){
this.inherited(arguments);
},
_setHeightAttr: function(av) {
this._set("height", av);
domStyle.set(this.domNode, "height", this.height +"px");
},
_setContentAttr: function(av) {
this._set("content", av);
if(this.content!=""){
this._addText(this.content);
}
},
_setTextSrcAttr: function(av) {
this._set("textSrc", av);
if(this.textSrc!=""){
var articleText = xhr.get({
url: this.textSrc,
handleAs: "text"
});
var domNode = this;
articleText.then( function(text){
domNode._addText(text);
});
}
},
_addText: function(text){
var index = 0;
while( this.measureNode.scrollHeight < this.height && index < text.length )
{
this.containerNode.innerHTML += text.charAt(index);
index++;
}
if(index < text.length){
this.containerNode.innerHTML = text.substring(0,index-1);
}
else{
this.ellipsisNode.innerHTML = "";
this.endPointNode.innerHTML = "";
}
}
});
})
つまり、このウィジェットが基本的にどのように機能するかというと、コンテンツではなくコンテンツを呼び出すとtextSrc、コンテンツ内の文字列がに送信されaddText()て表示されます。それ以外の場合、xhrはのURLを読み取り、URLtextSrc内の文字列をに送信しますaddText()。高さが目的の高さ（measureNode内）を超えるか、文字がaddText()なくなるまで、文字列から文字を追加します。最後に省略記号と「続きを読む」アンカー用のスペースがあります。ここで問題となるのは、コンテンツの使用が機能しないことです。ここにいくつかの「症状」がありますmeasureNodecontainerNode
- オーバーフローがあっても文字列全体が表示されます
- その理由は、this.measureNode.scrollHeightが常に0であるためです。これは、URLを。で使用すると期待される数値が生成されるため、奇妙です
textSrc。
this._addText("blah blah blah blah ...")textSrcとcontentの両方に文字列だけをフィードしたので、in_setContentAttrとdomNode._addtext("etc")inのようなものでtextSrc、結果は同じでした。また、このウィジェットを使用してコンテンツを呼び出したときのインスタンスを置き換えましたtextSrc。その逆も同様で、textSrcのみが成功します。これは、CSSの問題ではないことを意味します。私の推測では、xhrはtextSrc addTextコマンドの実行を延期しましたが、コンテンツは延期しなかったため、延期と関係があると思います。誰かが私に何が起こっているのか、そして私がこの問題をどのように解決できるのか説明できますか？
編集：それで、おそらくhtmlがまだレンダリングされていないため、ウィジェット内のdomNodeのがアクティブでないというoffsetHeight問題を切り分けたと思います。clientHeightその時点でレンダリングが完了していたため、URLの延期は機能しました。しかし、私はまだ合理的な解決策を見つけることができません。postCreateなんらかの理由でイベントが機能しません。誰かが回避策を知っていますか？ありがとう！