реализация выбора и отмены (переключения) на SELECT TAG - PullRequest
Новая
       14

реализация выбора и отмены (переключения) на SELECT TAG

1 голос
/ 07 августа 2009

Текущий тэг HTML SELECT отлично работает для меня, за исключением одной вещи. Можно ли реализовать переключение на текущий элемент.

Если у меня есть текущий выбор, я бы хотел щелкнуть по нему еще раз и отменить выбор. Теперь он не работает таким образом, он просто сохраняет текущий выбор "выбранным".

Кажется, мне нужно знать «предыдущий» выбор наряду с «текущим» выбором и сравнить 2, чтобы увидеть, нужно ли мне «отменить выбор» все. Как мне получить предыдущий выбор, все, что я знаю, это "selectedIndex", который является текущим выбором.

Есть ли способ?

1 Ответ

0 голосов
/ 07 августа 2009

Для этого вы можете использовать немного javascript следующим образом. Я проверил, и, кажется, работает, как вы просили. Я многословен для читабельности, но вы можете очистить, как только у вас это получится. 

<script language="JavaScript" type="text/javascript">
    function toggleSelectedValue() {

        var selObj = document.getElementById('myList');
        var selIndex = selObj.selectedIndex;
        var selValue = selObj.options[selIndex].value;
        var prevSelValue = document.getElementById('trackSelectedValueHiddenField').value;

        if (selValue == prevSelValue) {

            //Delect "all" items
            selObj.selectedIndex = -1;
            document.getElementById('trackSelectedValueHiddenField').value = 0;
        }
        else {setSelectedValue();}

    }
    function setSelectedValue() 
    {
        var selObj = document.getElementById('myList');
        var selIndex = selObj.selectedIndex;
        document.getElementById('trackSelectedValueHiddenField').value = selObj.options[selIndex].value;
    }
    </script>

</head>
<body>
<div id="wrapper">
    <div id="contentDiv" style="height:686px; border: solid 1px red;">
    <select multiple="multiple" id="myList" onclick="toggleSelectedValue()">
        <option value="1">Test</option>
        <option value="2">Test</option>
        <option value="3">Test</option>
    </select>
    <input type="hidden" id="trackSelectedValueHiddenField" value="0" />
    </div>
</div>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...