Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Проблема с атрибутом style в IE 
:(
    Опции темы
BuShaRt
Дата 27.4.2007, 14:11 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


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

Репутация: нет
Всего: 6
Достаточно банальная проблема... 

Код

<input value="Логин" name="input" 
onblur="input.setAttribute('style','border: 1px double #FFFFFF;');" 
onfocus="input.setAttribute('style','border: 1px double #000000;');" 
style="border: 1px double #FFFFFF;">


Данный код не работает в IE, как устранить проблему или быть может есть альтернативные решения задачи, суть которой в слудующем:
Есть текст, пре нажатие на него, он выделяеться как input type=text, после того как фокус спал, он выглядит снова как текста...

До этого использовал следующий код, но мне кажеться есть более рациональные подходы и в нижеописанном случае сильно пользают поля в, если юзать его в таблице... Кроме того, еще проблемы с написанием интерации для *скрытия input*

Код

document.onclick = function (e) {
    e = e || window.event;                                         
    var el = e.target || e.srcElement;
    if (el.getAttribute("trans_text")) {
        var input = document.createElement("input");
        input.setAttribute("type","text");
        input.setAttribute("size","15");
        input.setAttribute("value", el.textContent || el.innerText);
        el.parentNode.replaceChild(input,el);
    } 


Добавлено через 4 минуты и 56 секунд
Забыл, пояснить, что нужно то... нужно или подсказать, как первый пример кода сделать валидным для IE или же, подсказать как можно решить проблему другим способом...
PM MAIL   Вверх
ksnk
Дата 27.4.2007, 16:49 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386
Код

<style>
.st1 {border: 1px double #FFFFFF; }
.st2 {border: 1px double #000000; } 
</style>
<input value="Логин" class="st1" name="input" 
onBlur="this.className='st1'" 
onFocus="this.className='st2'" >




--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
BuShaRt
Дата 27.4.2007, 17:08 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


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

Репутация: нет
Всего: 6
ksnk, 
Большое спасибо smile
PM MAIL   Вверх
BuShaRt
Дата 27.4.2007, 20:17 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


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

Репутация: нет
Всего: 6
Возник вопрос пре внедрение этого кусочка в общий скрипт

Код

document.onBlur = function (e) {
    e = e || window.event;                                         
    var el = e.target || e.srcElement;
    if (el.getAttribute("class")) {
        el.parentNode.className='st1';
    }
}            

document.onFocus = function (e) {
    e = e || window.event;                                         
    var el = e.target || e.srcElement;
    if (el.getAttribute("class")) {
        el.parentNode.className='st2';
    }
} 


теперь негде не работает :(
PM MAIL   Вверх
ksnk
Дата 27.4.2007, 20:30 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386
BuShaRt, А откуда беруться такие странные кусочки кода и какая надобность в их "внедрении"? Можно задачу описать словами?


--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
BuShaRt
Дата 27.4.2007, 20:38 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


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

Репутация: нет
Всего: 6
ksnk, 
Вообщем я делаю динамическую таблицу, для подключения к AJAX в будущем (надеюсь скором), это мое первое творение на JS, от того столько проблем наверно smile

вот весь код)

Код

<html><head><title>AutoSaveTable</title>
<style>
.st1 {border: 1px double #FFFFFF; }
.st2 {border: 1px double #000000; } 
</style>
<script>
document.onBlur = function (e) {
    e = e || window.event;                                         
    var el = e.target || e.srcElement;
    if (el.getAttribute("class")) {
        el.parentNode.className='st1';
    }
}            

document.onFocus = function (e) {
    e = e || window.event;                                         
    var el = e.target || e.srcElement;
    if (el.getAttribute("class")) {
        el.parentNode.className='st2';
    }
} 
  
document.onclick = function (e) {
    e = e || window.event;                                         
    var el = e.target || e.srcElement;
    if (el.getAttribute("button_add")) {
        row = autotable.insertRow(1);
        row.setAttribute("id","row3");
        cell1 = row.insertCell(0);
        cell1.setAttribute( "height", "50" );
        cell1.setAttribute( "align", "center" );  
            var input = document.createElement("input");
            input.setAttribute("type","checkbox");
            input.setAttribute("value","3");
            input.setAttribute("name","del_me[]");
            cell1.appendChild(input);    
        cell2 = row.insertCell(0);
        cell2.setAttribute( "height", "50" );
        cell2.setAttribute( "align", "center" ); 
            var input = document.createElement("input");   
            input.className='st2';
            cell2.appendChild(input);        
        cell3 = row.insertCell(0); 
        cell3.setAttribute( "height", "50" );
        cell3.setAttribute( "align", "center" ); 
            var input = document.createElement("input");
            input.className='st2';
            cell3.appendChild(input);    
        cell4 = row.insertCell(0); 
        cell4.setAttribute( "height", "50" );
        cell4.setAttribute( "align", "center" ); 
            var input = document.createElement("input");
            input.className='st2';
            cell4.appendChild(input);    
    }   
    if (el.getAttribute("button_del")) {
        var tab = document.getElementById('autotable'), i = 0;
        while(tab.rows[i]){
            var inps = tab.rows[i].getElementsByTagName('input');
            if (inps[inps.length-1].checked) tab.deleteRow(i);
            else i++;
        }
    }
};
</script></head>
<body id='body'>
<table border="1" width="100%" id='autotable'>
<thead>
    <tr>
        <td height="50" align="center">Имя</td>
        <td height="50" align="center">Отчество</td>
        <td height="50" align="center">Фамилия</td>
        <td height="50" align="center"><input button_del='1' type='button' value='Удалить'><input button_add='1' type='button' value='Добавить'></td>
    </tr>
</thead>
<TBODY>
    <tr id="row1">
        <td height="50" align="center"><input value="Иван" class="st1"></td>
        <td height="50" align="center"><input value="Иванович" class="st1"></td>
        <td height="50" align="center"><input value="Иваненко" class="st1"></td> 
        <td height="50" align="center"><input type="checkbox" value="1" name="del_me[]"></td>
    </tr>
    <tr id="row2">
        <td height="50" align="center"><input value="Петр" class="st1"></td>
        <td height="50" align="center"><input value="Петрович" class="st1"></td>
        <td height="50" align="center"><input value="Петроченко" class="st1"></td>    
        <td height="50" align="center"><input type="checkbox" value="2" name="del_me[]"></td>
    </tr>
</TBODY>
</table>
</body></html>




Добавлено через 2 минуты и 32 секунды
А... забыл написать.. надобность во внедрение... Там в скрипте видно, что в таблицу добавляються еще строки... я подумал, что вот так будет проще, наверно, да и не получалось динамически на события повесить изменения классов...
PM MAIL   Вверх
ksnk
Дата 27.4.2007, 21:22 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386
onBlur и onFocus надо вешать на тот элемент, фокус которого интересует. Если повесить его на document, то толку не будет - он всегда в фокусе smile 
Разумнее повесить такой сервис на document.body.onclick. Тогда нужно проверить - куда-же мы кликнули ...

В общем - убрать тот ужасть, что написан с document.obBlur|Focus и после /body вставить вот это
Код

</body><script>
pastinput=null
document.body.onclick = function (e) {
     var e = e || window.event,
        el = e.target || e.srcElement;
    // немного мистики :)
    while(el && (!el.tagName || el.tagName.toLowerCase()!='input')) el= el.parentNode;
    if(pastinput) {
       pastinput.className='st1';
       pastinput=null
    }
    if(el) {
       pastinput=el
       el.className='st2';
    }
} 
</script></html>



--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
BuShaRt
Дата 27.4.2007, 21:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


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

Репутация: нет
Всего: 6
ksnk, 
Ух.. спасибо smile Кажеться я уже почти все сделал, осталось, только попытать HTML - разметку в опепе, чтоб она не она не глючила... :(

Добавлено через 2 минуты и 28 секунд
Кстате, а нельзя проверку делать по параметру style, типо равен он st1 или st2, а то в данном случае у нас кнопочки начинаю тоже скриптом меняться  smile 
PM MAIL   Вверх
ksnk
Дата 27.4.2007, 23:28 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386
Хм.. да. Можно переписать хвост функции вот так.
Код

     var unfed; //  hope this one have 'undefined' type
    if(el && (typeof el.className!=typeof undef)&& el.className.match(/^st[12]/)) {
       pastinput=el
       el.className='st2';
    }
} 

Некоторая пляска с бубном имет место быть из-за странностей с типом undefined в разных броузерах.



--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
BuShaRt
Дата 28.4.2007, 09:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


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

Репутация: нет
Всего: 6
ksnk, 
Спасибо... Только начала учить JS, а эти пляски честно говоря уже достали, сколько проблем создатели обозривателей, на плечи программистов слвалило smile
PM MAIL   Вверх
  
 Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »

Подписаться на тему | Подписка на этот форум | Скачать/Распечатать тему


 




[ Время генерации скрипта: 0.0854 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
 По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.