VPF::Динамическое отображение таблицы

Throne

Дата 11.5.2006, 20:01 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 147
Регистрация: 10.5.2006

Репутация: нет
Всего: 2

В общем делал корзину и придумал такой скрипт для динамического отображения строк таблицы:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=1521">
<script language="javascript" defer>
<!--
    function filter() {
        var sClass = window.event.srcElement.value;
        var rows = document.all.tags("tr");
        if (rows) {
            for (var i = 0;i < rows.length;i++) {
                if ((rows[i].className != sClass) && (sClass != "")) {
                    rows[i].style.display = "none";
                } else {
                    rows[i].style.display = "block";
                }
            }
        }
    }
//-->
</script>
</head>

<body>

</script>
<form>
    <p>Выберете цвет: 
        <select id="mnuFilter" onchange="filter()">
            <option value="" selected>Все</option>
            <option value="111">зелёненькие</option>
            <option value="222">красненькие</option>
        </select> </p>
</form>
<table bordercolorlight="#000080" cellspacing="0" bordercolordark="#C0C0C0" border="1" width="100%">
    <tr class='111'>
        <td bgcolor="#33CC33">1
        </td>
    </tr>
    <tr class='111'>
        <td bgcolor="#33CC33">2
        </td>
    </tr>
    <tr class='222'>
        <td bgcolor="#FF0000">3
        </td>
    </tr>
    <tr class='222'>
        <td bgcolor="#FF0000">4
        </td>
    </tr>
</table>
</body>
</html>

Прошу помощи в двух вещах:
1. Не получилось сделать так, чтобы всё это совершалось не с помощью выпадающего меню, а, например, после нажатия на картинку или строку таблицы.
2. Работает ли скрипт где-нибудь кроме IE?

Помогите пожалуйста.

--------------------

Компьютер — это наредкость тупая вещь, но считает с феноменальной скоростью.

dstorm81

Дата 11.5.2006, 23:45 (ссылка)

(нет голосов)

Загрузка ...

бездельник

Профиль
Группа: Завсегдатай
Сообщений: 1178
Регистрация: 18.1.2006
Где: (16RU)

Репутация: 20
Всего: 39

Код


<html>
<head>
<style>
.green{background-color:green}
.red{background-color:red}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=1251">
<script language="javascript">
function filter(param) 
{
var rows = document.getElementById('mytable').getElementsByTagName('TD');
for (var i = 0;i<rows.length;i++)
    {
                if(rows[i].className!=param && param!='') 
        {
        rows[i].style.display='none';
        } 
        else
        {
        rows[i].style.display='block';
        }
    }
}
</script>
</head>
<body>
Выберете цвет: <br />
        <select onchange="filter(this.value)">
            <option value="" selected>Все</option>
            <option value="green">зелёненькие</option>
            <option value="red">красненькие</option>
        </select> 
<table width="600px" id="mytable">
<tbody>
    <tr><td onclick=filter(this.className) class='green'>1</td></tr>
    <tr><td onclick=filter(this.className) class='green'>2</td></tr>
    <tr><td onclick=filter(this.className) class='red'>3</td></tr>
    <tr><td onclick=filter(this.className) class='red'>4</td></tr>
</tbody>
</table>
</body>
</html>

что то типа нужного?, переделал под лису и осла, крава в лисе баги коечто доделать надо, а то тд съезжают

--------------------

на форуме с 8.12.2002 (http://forum.vingrad.ru/index.php?act=ST&f=10&t=4874&st=0#)

Throne

Дата 12.5.2006, 09:24 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 147
Регистрация: 10.5.2006

Репутация: нет
Всего: 2

Спасибо большое очень пригодилось smile

--------------------

Компьютер — это наредкость тупая вещь, но считает с феноменальной скоростью.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »