标签：
1、中介者模式的作用就是解除对象与对象之间的紧耦合关系。增加一个中介者对象后，所有的相关对象都通过中介者来通信，而不是互相引用，所以当一个对象发生改变时，只需要通知中介对象即可。中介者使各对象之间耦合松散，而且可以独立的改变他们之间的交互。中介者模式使网状的多对多关系变成了相对简单的一对多关系。
<select id="colorselect"> <option value="">请选择颜色</option> <option value="red">红色</option> <option value="blue">蓝色</option> </select> <select name="" id="memoryselect"> <option value="">请选择大小</option> <option value="16G">16G</option> <option value="32G">32G</option> </select> 请输入购买数量: <input type="text" id="numberInput" /><br/> 您选择了颜色: <div id="colorInfo"></div><br /> 您选择了内存: <div id="memoryInfo"></div><br /> 您输入了数量: <div id="numberInfo"></div><br /> <button id="nextBtn" disabled="true">请选择手机颜色和购买数量</button>
<script type="text/javascript">
var colorselect = document.getElementById("colorselect");
var memoryselect = document.getElementById("memoryselect");
var numberInput = document.getElementById("numberInput");
var colorInfo = document.getElementById("colorInfo");
var memoryInfo = document.getElementById("memoryInfo");
var numberInfo = document.getElementById("numberInfo");
var goods = {
"red|32G":3,
"red|16G":0,
"blue|32G":1,
"blue|16G":6
}
var mediator = (function(obj){
return {
change:function(obj){
var color = colorselect.value,
memory = memoryselect.value;
if(obj == colorselect){
colorInfo.innerHTML = color;
}else if(obj == memoryselect){
memoryInfo.innerHTML = memory;
}
}
}
})();
colorselect.onchange = function(){
mediator.change(this);
}
memoryselect.onchange = function(){
mediator.change(this);
}
numberInput.oninput = function(){
mediator.change(this);
}
标签：
原文地址：http://www.cnblogs.com/junwu/p/4911134.html
