0

変数「a」の値をラベルタグのクラス属性に更新しようとすると、コードに小さな問題があります。誰でも私を助けることができますか？ここに私のコードがあります

<html>
<head>
<style>
label.visible {visibility:visible}
label.hidden {visibility:hidden}
</style>
<script type="text/javascript">
var a;
function doset()
{
a="hidden";
alert(a);
return a;
}
</script>
</head>
<body>
<form>
<label class=visible>Hello</label>
<button onclick="doset()">v</button><br>
<label class=a>Hello1</label><br>
<label class=a>Hello2</label><br>
<label class=a>Hello3</label><br>
<label class=a>Hello4</label><br>
<label class=a>Hello5</label><br>
</form>
</body>
</html>

これがフィドルです：http://jsfiddle.net/M8CXN/

4

3 に答える 3

1

class=a

これは、クラス名をjavascriptグローバル変数にバインドしませんa。それらは、異なるコンテキストでは異なるものです。

クラスを操作する場合は、DOMを介して操作する必要があります。最も簡単な方法は、コンテナを使用することです。

<div id="myItems">
   <label>Hello1</label><br>
   <label>Hello2</label><br>
   ...

と

function doset() {
   a="hidden";
   document.getElementById("myItems").style.visibility = a;   
   alert(a);
}

と呼ばれる

<button onclick="doset(); return false;">v</button><br>
于 2012-08-02T10:40:07.330 に答える
0

関連するすべてのラベルに同じクラスを与える場合：

<label class="myclass">Hello1</label><br>
<label class="myclass">Hello2</label><br>
<label class="myclass">Hello3</label><br>

次に、これらをターゲットにして、必要なクラスを追加または削除できます。

$('.myclass').addClass('hidden');
$('.myclass').removeClass('hidden');

あるいは単に：

$('.myclass').hide();
$('.myclass').show();

（jQueryを使用）

于 2012-08-02T10:36:33.173 に答える
0 
<html>
<head>
<style>
label.visible {visibility:visible}
label.hidden {visibility:hidden}
</style>
<script type="text/javascript">

function setLabelsClass(){
    var form = document.getElementsByTagName('form');
    var labels = form[0].getElementsByTagName('label');
    for(var i=0,len=labels.length;i<len;i++){
        var lbl_class = labels[i].getAttribute('class');
        if(lbl_class==="") labels[i].setAttribute('class','hidden');
    }
}
</script>
</head>
<body>
<form>
<label class=visible>Hello</label>
<button onclick="setLabelsClass(); return false;">v</button><br>
<label>Hello1</label><br>
<label class="">Hello2</label><br>
<label class="">Hello3</label><br>
<label class="">Hello4</label><br>
<label class="">Hello5</label><br>
</form>
</body>
</html>​

フォームがもう送信されないため、AJAX を提供しないと、結局のところ良いアプローチではありません。考え直して、ここで私が話していることを理解していないかもしれないと感じていますが、理解できるでしょう。

于 2012-08-02T11:03:30.137 に答える