2

Webアプリケーション（ASP.NET2.0 C＃）があります。その中に、チェックボックスリストとボタンを含むdivがあります。

divの表示を切り替えたいので、JavaScriptコードをオンラインで入手しました。

コードは次のとおりです。

<script language="javascript">
var state = 'hidden';

function showhide(layer_ref) {

    if (state == 'visible') 
    {
        state = 'hidden';
    }
    else 
    {
        state = 'visible';
    }
    if (document.all) 
    { //IS IE 4 or 5 (or 6 beta)
        eval( "document.all." + layer_ref + ".style.visibility = state");
    }
    if (document.layers) 
    { //IS NETSCAPE 4 or below
        document.layers[layer_ref].visibility = state;
    }
    if (document.getElementById && !document.all) 
    {
        maxwell_smart = document.getElementById(layer_ref);
        maxwell_smart.style.visibility = state;
    }
}
</script>

この関数を次のように呼び出します。

<a href="javascript://" onclick="showhide('AlertDiv');">Choose Columns</a>

この関数を使用すると、ボタン付きのdivが表示されますが、チェックボックスリストが表示されません。...何が起こっているのかについて何かアイデアはありますか？

ありがとうございました。

4

2 に答える 2

2

可視性の代わりにディスプレイを使用してみましたか?

たとえば、次の代わりに:

document.getElementById(layer_ref).style.visiblity = "hidden";
document.getElementById(layer_ref).style.visiblity = "visible";

使用する：

document.getElementById(layer_ref).style.display = "none";
document.getElementById(layer_ref).style.display = "block";

getElementById バージョンだけでなく、可視性へのすべての参照を表示に置き換える必要があります。また、数行のコードでシナリオを処理するjQueryの使用を検討することもできます。さらに、onclick 属性を使用して HTML をクラウド化する必要はありません。

<script type="text/javascript" src="jquery-1.3.2.js">
</script>
<script type="text/javascript">
  $(document).ready(function() {
    $('.toggleLink').click(function(e) {
       e.preventDefault();
       $('#AlertDiv').toggle();
    });
  });
</script>
<a href="#" class="toggleLink">Choose Columns</a>
于 2009-04-01T14:50:27.917 に答える
2

いくつかの提案:

  1. ASP.NET AJAXやJQueryなどの JavaScript ライブラリの使用を検討する必要があります。これは、ブラウザ固有のコードを邪魔にならないようにするのに役立ちます。
  2. 単に切り替えるのではなく、チェックボックスの状態に基づいて可視性を設定します。
  3. この状況では、「可視性」よりも「表示」の方がおそらく適切なスタイルです。「可視性」を使用すると、「レイヤー」が非表示のときにあるはずの空白の領域が得られます。
  4. 「レイヤー参照」の代わりに、おそらく div タグの ID とチェックボックスの ID を渡したいでしょう。

asp.net ajax での例:

チェックボックスは次のとおりです。

<input type="checkbox" id="mycheck" onclick='showhide("mycheck","mylayer")' />

表示/非表示にする領域は次のとおりです。

<div id='mylayer'>content</div>

これがあなたの機能です：

<script language="javascript">
function showhide(checkboxid, layerid)
{

    if($get(checkboxid).checked==true)
    {
         $get(layerid).display = "none";
    }
    else
    {
         $get(layerid).style.display = "";
    }
}
</script>
于 2009-04-01T14:53:23.853 に答える