0

これらの単純なフォームでフォームを編集しようとしています

テスト:

<span id="a">30 <span id="aa" style="display:none;"><input type="text" id="aa" name="q"/></span></span>
<span id="cq"><a href="javascript:changeQty()">Change</a></span>
<span id="cq2" style="display:none"><a href="javascript:save()">save</a></span>

<script>
  function changeQty(){
    document.getElementById("a").style.display="hidden";
    document.getElementById("aa").style.display="inline";
    document.getElementById("cq").style.display="hidden";
    document.getElementById("cq2").style.display="inline";
  }
</script>

しかし、奇妙なことに、フィールドを非表示にしようとしてもうまくいきません。Changeしかし、リンクをクリックすると非表示のフィールドを表示できます。私は何をしているのですか？

4

2 に答える 2

7

hiddenには属性がありません。displayを使用する必要がありますnone。

function changeQty(){
  document.getElementById("a").style.display="none";
  document.getElementById("aa").style.display="inline";
  document.getElementById("cq").style.display="none";
  document.getElementById("cq2").style.display="inline";
}
于 2013-05-21T02:38:54.240 に答える
1

あなたは2つの非常に単純な間違いを犯しました

  1. javascript では、隠し要素の表示スタイル属性に値「なし」を使用します

  2. 要素「aa」は、要素「a」の子要素です。したがって、
    document.getElementById("a").style.display="none";を使用すると、 要素「aa」も非表示にします

したがって、あなたが望むかもしれない最終的な解決策は次のとおりです

<span id="a">30</span>
<span id="aa" style="display:none;"><input type="text" id="aa" name="q"/></span>
<span id="cq"><a href="javascript:changeQty()">Change</a></span>
<span id="cq2" style="display:none"><a href="javascript:save()">save</a></span>

<script>
  function changeQty() {
    document.getElementById("a").style.display="none";
    document.getElementById("aa").style.display="inline";
    document.getElementById("cq").style.display="none";
    document.getElementById("cq2").style.display="inline";
   }
</script>
于 2013-05-21T03:03:19.693 に答える