1

画像、テキスト、チェックボックスを含むいくつかのボックスがあります。

<label name="skill" id="testbox" class="box tooltip" onclick="toggleCheckbox('test');"  style="background-image:url('red.png')">
<span><img class="callout" src="callout.png"><script>document.write (test);</script></span>
<div class="margin">
    <img src="">
    test<input name="choice" value="1" id="test" type="checkbox" onchange="onCheckboxChanged(); checkTotal();" disabled>
</div>

ラベル内の任意の場所をクリックして id (testbox) を取得し、この関数で使用しようとしました。

var onCheckboxChanged = function(checkbox){
var test = document.getElementById('test');
var testbox = document.getElementById('testbox');
var structure = document.getElementById('structure');
var structurebox = document.getElementById('structurebox');

if(structure.checked){
    test.disabled = false;
    structurebox.style.backgroundImage='url(green.png)';
}
else{
    test.disabled = true;
    structurebox.style.backgroundImage='url(grey.png)';
}

if(test.disabled){
    testbox.style.backgroundImage='url(red.png)';
}
else {
    if(test.checked){
        testbox.style.backgroundImage='url(green.png)';
    }
    else{
        testbox.style.backgroundImage='url(grey.png)';
    }
}
};

コードをコピーして貼り付けて ID を変更するだけで済みますが、70 個以上のボックスがあり、さらに多くなるでしょう。私は試した:

document.getElementsByName("skill")[0].getAttribute('id')

しかし、おそらく「スキル」という名前のボックスからすべてのIDを取得します。これに似たものを使用する必要があると思いますが、機能しますが、コードに接続する方法がわからないため、この関数からクリックされた ID を関数で使用できます (var が最適であるため)。

4

2 に答える 2