生成的js如下所示：
window.addEvent('domready', function() {
$('recipe').addEvent('change', function(event) {
if ($('recipe') document.getElementById('hide_it').selected === true) {
$('hide_me1').setStyle('opacity', '1');
$('hide_me2').setStyle('opacity', '1');
}
});
$('recipe').addEvent('change', function(event) {
if ($('recipe') document.getElementById('hide_none').selected === true) {
$('hide_me1').setStyle('opacity', '0');
$('hide_me2').setStyle('opacity', '0');
}
});
});
如果您使用类似于jslint/jshint的东西，甚至在jsiddle中粘贴并按下jslint按钮，它将立即报告问题
然而：
$（'recipe'）document.getElementById（'hide_it'）。selected==true）
毫无意义。我猜你是在试图用id隐藏选项，这是食谱的孩子吗
这样做是错误的，但这可能是：
$('recipe').getElement('#hide_it').get('selected'); // pointless as by id alone is faster and id is meant to be unique
document.getElement('#receipe #hide_id').get('selected'); // also pointless like above, alt syntax that allows you to combine selectors.
$('hide_it').get('selected'); // works but also wrong, not how you work with selects.
使用mootools获取select
值的正确方法如下：
$('receip').addEvent('change', function(){
// within this function, this === $('recipe');
var opacity = this.get('value') === 'hide_it' ? 1 : 0;
$$('#hide_me1,#hide_me2').setStyle('opacity', opacity);
// w/o a reference you could do in a single line:
$$('#hide_me1,#hide_me2').setStyle('opacity', +(this.get('value') == 'hide_it'));
});
这仍然有点无效，因为当2个隐藏事件可能是静态的时，它会查找每个更改事件
您还应该停止使用ID，并基于类使用这种模式，因为ID不能很好地扩展