0

ガジェットに2つの異なるビューを設定したいと思います。1つは追加されたばかりのとき、ユーザーが情報を入力できるようにするため、もう1つはユーザーがそれを完了すると、その情報に基づいてデータを表示するためです。

これらの2つのビューのどちらを表示する必要があるかを判断できる最も早い時点は、状態を初めて取得するとき、つまり状態コールバックのときです。ただし、そこでUIを変更すると、常に表示されるとは限りません。明らかに、タイミングの問題がいくつかあります。UIがまったく表示されない場合もあれば、正常に表示される場合もあります。ガジェットを読み込むアニメーションの前に表示される場合もあります。

簡単なテストケースは次のとおりです。

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="Trivial" height="120">
  <Require feature="wave" />
</ModulePrefs>
<Content type="html">
<![CDATA[
    <script type="text/javascript">
      function createForm () {
        document.write("<div id=\"form\">");
        document.write("Username: <input type=text value=\"whatever\" id=\"user_name\">");
        document.write("<input type=button value=\"Go!\" onClick=\"fetchFromUsername()\"><br>");
        document.write("NSID: <input type=text value=\"287312604@N00\" id=\"user_id\">");
        document.write("<input type=button value=\"Go!\" onClick=\"fetchFromNSID()\"><br>");
        document.write("Number of photos: <input type=text value=\"3\" id=\"per_page\">");
        document.write("</div>");
      }
    </script>
    <script type="text/javascript">
    function stateUpdated () {
      createForm ();
    }

    function init() {
      if (wave && wave.isInWaveContainer()) {
        wave.setStateCallback (stateUpdated);
      }
    }
    gadgets.util.registerOnLoadHandler(init);
    </script>
  ]]>
  </Content>
</Module>
4

1 に答える 1

0 
<script type="text/javascript">
  function createForm () {
    document.write("<div id=\"form\">");
    document.write("Username: <input type=text value=\"whatever\" id=\"user_name\">");
    document.write("<input type=button value=\"Go!\" onClick=\"fetchFromUsername()\"><br>");
    document.write("NSID: <input type=text value=\"287312604@N00\" id=\"user_id\">");
    document.write("<input type=button value=\"Go!\" onClick=\"fetchFromNSID()\"><br>");
    document.write("Number of photos: <input type=text value=\"3\" id=\"per_page\">");
    document.write("</div>");
  }
</script>

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-26809268ドキュメントでわかるように、

write: open() によって開かれたドキュメント ストリームにテキストの文字列を書き込みます。この関数は、必ずしも DTD によって駆動されるとは限らないドキュメントを生成するため、ドキュメントのコンテキストで無効な結果を生成する可能性があることに注意してください。

したがって、そのような方法を使用するのはクールではありません。DOM に適した方法で要素を作成および追加できる jQuery などのフレームワークを使用することをお勧めします。作業方法になります。

于 2009-10-29T03:37:50.727 に答える