0

3つのドロップダウン<select>ボックスを埋めるために使用されるデータ配列があります。私の質問は、配列から同じ値を削除するにはどうすればよいですか（配列自体ではなく、ドロップダウンから同じ値を削除（または）無効にします）？

例えば：

data = {
firstbox_a: ['grpA_1','grpA_2','grpA_3','grpA_4'],
firstbox_b: ['grpB_1','grpB_2','grpB_3','grpB_4'],
grpA_1: ['y','n','un','st'],
grpA_2: ['y','n','un','st'],
grpA_3: ['y','n','un','st'],
grpA_4: ['y','n','un','st'],
grpB_1: ['a','b','avg','unc'],
grpB_2: ['a','b','avg','unc'],
grpB_3: ['a','b','avg','unc'],
grpB_4: ['a','b','avg','unc']
}

grpA_1grpA_4同じ値になります。に「y」を選択した場合、からgrpA_1の値を無効にするか削除しても、「y」を選択できません。grpA_2grpA_4

4

2 に答える 2

0

前の回答に基づいて、あなたの質問を理解しているかどうかわかりません。私はあなたのデータを使用するつもりでしたが、リストがどのように入力されているか確信が持てませんでした.

このコードは 2 つのリストを作成します。2 番目のリストでオプションが選択されている場合、同じインデックスを持つ最初のリストの項目も無効になります。

<!DOCTYPE html>
<html>
<head>
<script>
function byId(e){return document.getElementById(e);}
function newEl(tag){return document.createElement(tag);}
function newTxt(txt){return document.createTextNode(txt);}
function toggleClass(element, newStr)
{
    index=element.className.indexOf(newStr);
    if ( index == -1)
        element.className += ' '+newStr;
    else
    {
        if (index != 0)
            newStr = ' '+newStr;
        element.className = element.className.replace(newStr, '');
    }
}
function forEachNode(nodeList, func)
{
    var i, n = nodeList.length;
    for (i=0; i<n; i++)
    {
        func(nodeList[i], i, nodeList);
    }
}

window.addEventListener('load', mInit, false);


function onList2Changed(list2_Element, list1_Element)
{
    var i;

    for (i=0; i<list1_Element.options.length; i++)
    {
        if (i == list2_Element.selectedIndex)
            list1_Element.options[i].setAttribute('disabled', 'true');
        else
            list1_Element.options[i].removeAttribute('disabled');
    }
}

function mInit()
{
    var opt, mSel1, mSel2;
    var i, numOpts = 10;

    mSel1 = newEl('select');
    for (i=0; i<numOpts; i++)
    {
        opt = newEl('option');
        opt.appendChild( newTxt("boxA: " + (i+1)) );
        mSel1.appendChild(opt);
    }
    mSel1.setAttribute('size', i);
    document.body.appendChild(mSel1);

    mSel2 = newEl('select');
    for (i=0; i<numOpts; i++)
    {
        opt = newEl('option');
        opt.appendChild( newTxt("disable BoxA option: " + (i+1)) );
        mSel2.appendChild(opt);
    }
    mSel2.addEventListener('change', myFunc);

    function myFunc()
    {
        onList2Changed(mSel2, mSel1);
    }
    document.body.appendChild(mSel2);
}

</script>
<style>
</style>
</head>
<body>
</body>
</html>
于 2013-03-10T10:25:13.723 に答える
0

頭に浮かぶ1つの解決策は次のとおりです。

ドロップダウン リストの項目の選択にイベントを添付します。


イベントでは、IF:他のドロップダウン リストのいずれかが同じ値で選択されている関数を追加します。
デフォルトを防止します。

例

$('.target').change(function() {
    // Your code goes in here :)
});
于 2013-03-10T10:20:27.473 に答える