VPF::атрибуты для форм - Форум программистов

marozz

Дата 19.3.2013, 19:25 (ссылка)

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

Загрузка ...

Новичок

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

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

Помогите разобраться. Нужно на странице найти все элементы с классом "some" (это будут input ) и установить для них атрибут readonly="readonly"
Признаюсь в javascript почти 0, пишу на php, прошу помощи

baldina

Дата 19.3.2013, 21:31 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

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

Код


if(document.getElementsByClassName === undefined) {
    document.getElementsByClassName = function(classList) {           
        var i,j,
        list = document.getElementsByTagName('*'),
        length = list.length, 
        classArray = classList.split(/\s+/),
        classes = classArray.length,
        result = [], i,j
        for(i = 0; i < length; i++)
            for(j = 0; j < classes; j++)
                if(list[i].className.search('\\b' + classArray[j] + '\\b') != -1) {
                    result.push(list[i])
                    break;
                }
        return result
    }
}

var some = document.getElementsByClassName('some');
for(var i=0; i < some.length; ++i)
    some[i].readOnly=true;

marozz

Дата 20.3.2013, 13:00 (ссылка)

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

Загрузка ...

Новичок

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

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

спасибо, но поля на которых установлен class='some' не блокируются

baldina

Дата 20.3.2013, 13:20 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

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

у меня блокируются: http://jsfiddle.net/VqSy3/
что я делаю не так?

Aliance

Дата 20.3.2013, 16:37 (ссылка)

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

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 17
Всего: 137

baldina, разве что еще стоило учесть это:

Цитата(marozz @ 19.3.2013, 20:25

)

(это будут input )

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

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

baldina

Дата 20.3.2013, 17:24 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

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

мож я чего не понял, но в моём примере

Цитата(baldina @ 20.3.2013, 13:20

)

http://jsfiddle.net/VqSy3/

именно input

marozz

Дата 20.3.2013, 19:04 (ссылка)

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

Загрузка ...

Новичок

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

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

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<head><title>тест</title>
<script type="text/javascript">
if(document.getElementsByClassName === undefined) {
    document.getElementsByClassName = function(classList) {           
        var i,j,
        list = document.getElementsByTagName('*'),
        length = list.length, 
        classArray = classList.split(/\s+/),
        classes = classArray.length,
        result = [], i,j
        for(i = 0; i < length; i++)
            for(j = 0; j < classes; j++)
                if(list[i].className.search('\\b' + classArray[j] + '\\b') != -1) {
                    result.push(list[i])
                    break;
                }
        return result
    }
}

var some = document.getElementsByClassName('some');
for(var i=0; i < some.length; ++i)
    some[i].readOnly=true;

</script>
</head>
<body>
<input type='text' class='some'/>
</body>
</html>

Попробуйте соххранить в файл и выполнить в браузере.
Не работает, что я делаю не так?

Это сообщение отредактировал(а) marozz - 20.3.2013, 19:13

baldina

Дата 20.3.2013, 19:23 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

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

Цитата(marozz @ 20.3.2013, 19:04

)

Не работает, что я делаю не так?

пытаетесь обработать элементы, которых еще нет в html на момент запуска скрипта.
javascript отрабатывает немедленно, так что надо выполнять свой код после загрузки всей страницы или хотя бы поместить скрипт после тегов, которые он обрабатывает

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<head><title>тест</title>
<script type="text/javascript">
if(document.getElementsByClassName === undefined) {
    document.getElementsByClassName = function(classList) {           
        var i,j,
        list = document.getElementsByTagName('*'),
        length = list.length, 
        classArray = classList.split(/\s+/),
        classes = classArray.length,
        result = [], i,j
        for(i = 0; i < length; i++)
            for(j = 0; j < classes; j++)
                if(list[i].className.search('\\b' + classArray[j] + '\\b') != -1) {
                    result.push(list[i])
                    break;
                }
        return result
    }
}
</script>
</head>
<body>
<input type='text' class='some'/>
<script type="text/javascript">
var some = document.getElementsByClassName('some');
for(var i=0; i < some.length; ++i)
    some[i].readOnly=true;
</script>
</body>
</html>

marozz

Дата 20.3.2013, 20:03 (ссылка)

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

Загрузка ...

Новичок

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

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

baldina, точно, сори. А нельзя ли в саму функцию дописать инициализацию скрипта после полной загрузки страницы, чтоб не прописывать javascript код в тело страницы, а вынести его в отдельный файл. Может бред конечно несу smile

и еще такой момент, возможно ли модифицировать скрипт таким образом чтоб к примеру если есть конструкция

Код


<div class='slaas'>
    <p>Текст</p><input  type='checkbox' ><input type='text'>
</div>

Если на втором input (type='text')установлен класс some, он не просто блокируется, но и при этом для checkbox возле него присваивается свойство display:none , при этом обойтись без присвоения id для checkbox

Это сообщение отредактировал(а) marozz - 20.3.2013, 20:25

baldina

Дата 20.3.2013, 21:08 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

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

Цитата(marozz @ 20.3.2013, 20:03

)

нельзя и в саму функцию дописать инициализацию скрипта после полной загрузки страницы,

Код


window.onload = function (){
  var some = document.getElementsByClassName('some');
  for(var i=0; i < some.length; ++i)
    some[i].readOnly=true;
}

еще лучше какой-нить библиотекой воспользоваться, напр. jquery

Цитата(marozz @ 20.3.2013, 20:03

)

возможно ли модифицировать скрипт таким образом чтоб к примеру если есть конструкция

можно. только придется поработать с DOM. что бы сделать это проще, опять же jquery и т.п. поможет

marozz

Дата 20.3.2013, 21:18 (ссылка)

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

Загрузка ...

Новичок

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

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

baldina, jquery уже впринципе на странице для других скриптов используется. Вот как это написать ? не поможете студенту ? smile

буду очень благодарен smile

baldina

Дата 20.3.2013, 22:13 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

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

Цитата(marozz @ 20.3.2013, 21:18

)

jquery уже впринципе на странице для других скриптов используется. Вот как это написать ?

ищите функцию ready и вписывайте туда то что нужно.

Код


jQuery().ready(function (){
 ....
  var some = document.getElementsByClassName('some');
  for(var i=0; i < some.length; ++i)
    some[i].readOnly=true;
 ....
})

насчет второго курите селекторы

Добавлено через 4 минуты и 16 секунд
кстати при использовании jquery огород с document.getElementsByClassName городить не надо

Код


$().ready(function (){
 ....
  $(".some").attr("readOnly", true);
 ....
})

Aliance

Дата 21.3.2013, 10:21 (ссылка)

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

Загрузка ...

I ♥ <script>

Профиль
Группа: Модератор
Сообщений: 6418
Регистрация: 2.8.2004
Где: spb

Репутация: 17
Всего: 137

Цитата(baldina @ 20.3.2013, 18:24

)

мож я чего не понял, но в моём примере именно input

я по ссылке не переходил, а смотрел пример кода, который непосредственно здесь был во втором посте. там был нативный js аналог такой конструкции:

Код

$('.some')

а я лишь уточнил, что автору нужно более конкретно:

Код

$('input.some')

хотя это все мелочи, и собственно jQuery легко в этом поможет.

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

• Все о событиях
• Объекты и массивы
• ОКНА И ФРЕЙМЫ

JAVA ≠ JavaScript

baldina

Дата 21.3.2013, 11:32 (ссылка)

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

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 3433
Регистрация: 5.12.2007
Где: Москва

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

нативный код реализовал getElementsByClassName, тут теги непричем
а в посте ТС было

Цитата(marozz @ 19.3.2013, 19:25

)

найти все элементы с классом "some" (это будут input )

т.е. найти все, а что они все input типа и так получится. а если надо, с выбиранием input ТС и сам справится)))
тем боле теперь, с jquery smile

marozz

Дата 21.3.2013, 11:54 (ссылка)

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

Загрузка ...

Новичок

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

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

baldina, спасибо, тут вроде вроде ясно, а как можно сделать подобное ?

Цитата

и еще такой момент, возможно ли модифицировать скрипт таким образом чтоб к примеру если есть конструкцияРазметка HTML

Код


<div class='slaas'>
    <p>Текст</p><input  type='checkbox' ><input type='text'>
</div>

Если на втором input (type='text')установлен класс some, он не просто блокируется, но и при этом для checkbox (если он есть) возле него присваивается свойство display:none , при этом обойтись без присвоения id для checkbox

Это сообщение отредактировал(а) marozz - 21.3.2013, 17:08

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