0

ユーザーにテキストを入力する方法は2つあります。入力テキストフィールドを使用する方法と、ドロップダウンメニューから事前定義されたテキストを選択する方法です。Javascriptは、どちらを表示するかを制御します。したがって、これら2つの入力メソッドとそれに対応する2つのラベルがあります。

<h:form id="test">
<div>
  <h:outputLabel id="label_1" value="Your text:" style="display:block" />
  <h:inputText id="txt" value="#{myform.inputText}" style="display:block" />

  <h:outputLabel id="label_2" value="Choose text:" style="display:none" />
  <h:selectOneMenu id="drop" value="#{myform.inputText}" style="display:none">
    <f:selectItem itemValue="11" itemLabel="Preselected text 1" />
    <f:selectItem itemValue="22" itemLabel="Preselected text 2" />
  </h:selectOneMenu>
</div>
</h:form>

javascriptは、要素を表示および非表示にします。

if (...) {
  document.getElementById('label_1').style.display="none";
  document.getElementById('txt').style.display="none";
  document.getElementById('label_2').style.display="block";
  document.getElementById('drop').style.display="block";
}
else {
  document.getElementById('label_1').style.display="block";
  document.getElementById('txt').style.display="block";
  document.getElementById('label_2').style.display="none";
  document.getElementById('drop').style.display="none";
}

したがって、label_1+txtまたはlabel_2+dropのいずれか です。問題は次のとおりです。ページが読み込まれると、label_1+txtのみが表示されます。残念ながら、label_1、label_2、txtは表示されています。

dropの定義style="display：none"が機能し、label_2の同じ定義が機能しないのはなぜですか？

4

2 に答える 2

0

ラベルを隠す

function Hide(id) {
    document.getElementById(id).style.visibility = "hidden";
}​

Hide('label_1');

ラベルを表示

function Show(id) {
    document.getElementById(id).style.visibility = "visible";
}

Show('label_1');
于 2012-12-11T13:25:19.897 に答える
0

解決策は、本文のスクリプトにjQueryブロックを追加することでした

$(document).ready(function() {
    $('[id$=label_2]').hide();
    $('[id$=drop]').hide();
});
于 2012-12-11T16:51:33.440 に答える