2010-06-28 4 views
0

Я использую sizzle для выбора различных частей DOM.JavaScript - возникли проблемы с событием click

Мой код ниже. Проблема в том, что событие onmouseup запускается, когда страница загружается, а не когда пользователь взаимодействует со страницей.

Может кто-нибудь объяснить, почему это так.

Спасибо.

// Effects object 
var effects = { 
    // Display an object 
    show : function(obj) { 
     obj.style.display = 'block'; 
    }, 
    // Hide an object 
    hide : function(obj) { 
     obj.style.display = 'hide'; 
    }, 
    // Toggle 
    toggle : function(obj) { 
     if (obj instanceof Array) { 
      alert('array'); 
     } else { 
      alert('single');  
     } 
    } 
} 

// Selector Class 
var s = Sizzle; 

window.onload = function() { 
    s('#toggle-content').onmouseup = effects.toggle(s('.hidden-content')); 
} 

HTML по запросу:

<div class="page-content box create-page"> 
    <h1><span class="left">Create Page</span><a class="right" id="toggle-content" href="#">Expand</a></h1> 
    <div class="hidden-content"> 
     ... 
    </div> 
</div> 
+0

Это поможет, если вы разместите некоторые из HTML, на которые вы хотите повлиять (например, элементы «toggle-content» и «hidden-content»). – Pointy

+0

Добавлен HTML в соответствии с запросом. – JasonS

ответ

1

Это потому, что вы вызываете effects.toggle в выражении. Вы должны фактически привязать функцию, чтобы избежать ее вызова.

 
    function bind() { 
    var initArgs = array(arguments); 
    var fx =  initArgs.shift(); 
    var tObj =  initArgs.shift(); 
    var args =  initArgs; 
    return function() { 
     return fx.apply(tObj, args.concat(array(arguments))); 
    }; 
    } 
    function array(a) { 
    var r = []; for (var i = 0; i < a.length; i++) 
     r.push(a[i]); 
    return r; 
    } 

window.onload = function() { 
    s('#toggle-content').onmouseup = bind(effects.toggle, null, s('.hidden-content')); 
} 
+0

Это вызывает ошибку javascript. 'array не определен' – JasonS

+0

Исправлено. Извини за это! –

3

необходимо передать его как анонимную функцию, например.

window.onload = function() { 
    s('#toggle-content').onmouseup = function(){effects.toggle(s('.hidden-content'));} 
} 
+0

Это то, что я пробовал изначально. Он ничего не делает. В браузере нет ошибок и ничего не предупреждаются. Когда я перемещаю раздражающую функцию на именованную функцию. Тогда есть. s ('# toggle-content'). Onmouseup = toggle(); Он по-прежнему запускается при загрузке страницы. – JasonS

+0

Для этого вам не нужны скобки - вот почему вы используете анонимную функцию, чтобы вы могли передавать параметры. – matpol

Смежные вопросы