Выделите строку формы, когда ввод сфокусирован - PullRequest
Новая
       10

Выделите строку формы, когда ввод сфокусирован

0 голосов
/ 28 мая 2010

У меня есть следующий фрагмент кода Mootools 1.11 (не обновляемый, так как он есть в Joomla), который я хочу выделить в строке формы, когда элемент внутри нее сфокусирован. Тем не менее, это не работает. Мне нужно знать, как получить доступ к родительскому элементу div элемента формы. 

window.addEvent('domready', function() {
    var list = $$('#ChronoContact_lensorder div.formrow');
    list.each(function(element) {

var fx = new Fx.Styles(element, {duration:200, wait:false});

element.addEvent('focus', function(){
    fx.start({
        'background-color': '#e6f0f2',
        color: '#FFF'
    });
});

element.addEvent('focus', function(){
    fx.start({
        'background-color': '#FFF',
        'color': '#2F9AD0'
    });
});

}); 
});

HTML это: 

<div class="formrow"> 
<label for="ud">Uncut Diameter:</label> 
<input type="text" id="ud" name="ud" /> 
</div>

Спасибо

1 Ответ

0 голосов
/ 28 мая 2010

Вместо поиска <div> с, вы, возможно, захотите поискать фактическое <input>, используя var list = $$('#ChronoContact_lensorder div.formrow input');. Затем при необходимости обратитесь к родителю, используя метод .getParent(), например, так: 

window.addEvent('domready', function() {
    var list = $$('#ChronoContact_lensorder div.formrow input');
    list.each(function(element) {

var fx = new Fx.Styles(element.getParent(), {duration:200, wait:false});

element.addEvent('focus', function(){
    fx.start({
        'background-color': '#e6f0f2',
        color: '#FFF'
    });
});

element.addEvent('blur', function(){
    fx.start({
        'background-color': '#FFF',
        'color': '#2F9AD0'
    });
});

}); 
});

Не проверенный код. Обратите внимание, что второе событие теперь blur вместо focus, иначе оба события сработают одновременно и могут обратить эффекты друг друга!

...