0

Phone Gap Build を使用してスマートフォン アプリに変換する予定の Web アプリを構築しています。私はこれまでこれをやったことがないので、私の問題を明確に説明していないかもしれませんが、ここに行きます. Dreamweaver で jquery モバイル サンプルを使い始めました。これには、1 つの html ファイルに複数のページが含まれています。私がやりたいのは、各ページに一連の英語のフレーズを掲載することです。各英語のフレーズの後に正式なスペイン語の翻訳が続き、次に非公式のスペイン語の翻訳が続きます。ページの上部には、「フォーマル」、「インフォーマル」、「フォーマル & インフォーマル」という 3 つのボタンがあります。ユーザーは、押した/タップしたボタンに応じて、英語のフレーズに続いて、フォーマル、インフォーマル、またはフォーマル & インフォーマル スペイン語が常に表示されます。

ホームページはhttp://www.pslt.biz/mobileApp/LE4/index3.htmlで見ることができます。次に、「年齢、体重、身長」をクリックします。フォーマル/インフォーマル ボタンをクリックしても、最初のフレーズ「How old are you」の下にあるスペイン語。CSS クラス ".formal" を Display:Block に設定し、".informal" クラスを Display:None に設定する Formal ボタンが役立ちます。

     <a href="#" onclick="document.getElementById('formal').style.display='block';document.getElementById('informal').style.display='none';">Display   Formal</a>

CSS クラスは、次のように外部で定義されます。

    .formal { display:block;
    }

    .informal {display:block;
    }

また、スペイン語のフレーズは次のように div で定義されています。

     <div class="formal"> <!-- Start Formal -->
             <div style="float:left">
                 <a href="#" onclick="playSound('Sounds/testaycaramba.mp3');">
                 <img src="images/audio-75.gif" alt="" width="25" height="25" /></a>
              </div>
              <div style="float:left">
                  Cuántos años tiene?
              </div>
      </div> <!-- End Formal -->
      <div class="informal"> <!-- Start informal -->
              <div style="clear:left">
                  <div  style="float:left">
                      <a href="#" onclick="playSound('Sounds/testaycaramba.mp3');">
                      <img src="images/audio-75.gif" alt="" width="25" height="25" /></a>
                  </div>
                  <div>
                       Cuántos años tienes?
                  </div>
              </div>
      </div> <!-- End informal -->

誰かが私を正しい方向に向けることができれば、本当に感謝しています。簡単にできると思いましたが、盲目的に明らかな何かが欠けているに違いありません。

4

5 に答える 5

1

jQueryを使用できます：

<a href="#" 
    onclick="$('.formal').css('display', 'block'); $('.informal').css('display', 'none');">Display Formal</a>

問題は、div に ID ではなく「正式」と「非公式」のクラスがあり、ID で選択していることです。

別のオプション：

    <a href="#" onclick="$('.formal').show();$('.informal').hide()">Display Formal</a>
于 2013-06-04T11:13:37.240 に答える
1

MiFeet のソリューションは完璧に機能しました。ディスプレイフォーマルを使った

なんらかの理由で、チェックボックスをクリックしたときにエラーが発生したことを答えとして表示できませんでした。これが他の人の助けになることを願っています。

トニー・バブ

于 2013-06-06T11:04:40.477 に答える
0

持っている場合はclass="informal"、それを置き換えてこれをclass="informal1"試してください

<a href="#" onclick="change();" id="remove" class="informal">Display Formal</a>

function change(){

$('#remove').removeClass('informal');
$("#remove").addClass("informal1");

}
于 2013-06-04T13:13:49.450 に答える
0

JS コード:

button.onclick=function(){

    element=document.getElementsByClassName("formal")[0];
    element.className="informal";

}
于 2013-06-04T11:03:48.980 に答える