求一个效果！在线等。谢谢各位！！！！！！！！！！！！！！

Question

本帖最后由 pdmwxy 于 2009-06-28 23:11:57 编辑

Answer 1

<script type="text/javascript">
<!--
function show(ock,sign){
var oli  = document.createElement("li"),oul = document.getElementById("demo");
oli.innerHTML = ock.value;oli.name = sign;
if(ock.checked){
oul.appendChild(oli);
}else{
for(var i = 0;iLi = oul.getElementsByTagName("li"), i < iLi.length; i++){
if(iLi[i].name == sign){
oul.removeChild(iLi[i]);
}
}
}
}
//-->
</script>
<input type="checkbox" onclick="show(this,'a1')" value="图书"/>图书
<input type="checkbox" onclick="show(this,'a2')" value="衣服"/>衣服
<ul id="demo" style="width:140px;height:140px;border:1px solid red;list-style:none;text-align:left">
<li>选中的产品</li>
</ul>

Answer 2

<span><input name="a" type="checkbox" value="1" onclick="show(this)"><span>aaa</span></span>
<span><input name="a" type="checkbox" value="2" onclick="show(this)"><span>bbb</span></span>
<span><input name="a" type="checkbox" value="3" onclick="show(this)"><span>ccc</span></span>
<span><input name="a" type="checkbox" value="4" onclick="show(this)"><span>ddd</span></span>
<div style="backgroud-color:red" id="div1"></div>
<script language="javascript">
function show(obj)
{
var objs=document.getElementsByName("a")
var result=new Array();
for(var i=0;i<objs.length;i++)
{
if(objs[i].checked)
{
result.push("<img src='yao pic'>"+objs[i].nextSibling.innerHTML)
}
}
document.getElementById("div1").innerHTML=result.join("&nbsp;")
}
</script>

Answer 3

<span><input name="a" type="checkbox" value="1" onclick="show(this)"><span>aaa</span></span> 
<span><input name="a" type="checkbox" value="2" onclick="show(this)"><span>bbb</span></span> 
<span><input name="a" type="checkbox" value="3" onclick="show(this)"><span>ccc</span></span> 
<span><input name="a" type="checkbox" value="4" onclick="show(this)"><span>ddd</span></span>
<div id="div1"></div>
<script language="javascript">
var str=""
function show(o) {
  var sName=o.nextSibling.innerHTML;
  str=o.checked?str+sName+" " : str.replace(sName+" ","");
  document.getElementById("div1").innerHTML=str;
}
</script>

Answer 4

<span><input name="a" type="checkbox" value="1" onclick="show(this)" productName="产品A"><span>产品A</span></span>
<span><input name="a" type="checkbox" value="2" onclick="show(this)" productName="产品B"><span>产品B</span></span>
<span><input name="a" type="checkbox" value="3" onclick="show(this)" productName="产品C"><span>产品C</span></span>
<span><input name="a" type="checkbox" value="4" onclick="show(this)" productName="产品D"><span>产品D</span></span>
<div style="backgroud-color:red" id="div1"></div>
<script language="javascript">
 function show(obj)
 {
  var html =  document.getElementById("div1").innerHTML;
if(obj.checked){ //勾选
if(html.length > 0){ //之前已经选中了某些产品
html = html + "," + o.productName;
}else{ //之前未选中任何产品
html = o.productName;
}
}else{ //取消勾选
html = html.replace(o.productName+",", "");
}
  document.getElementById("div1").innerHTML=html;
 }
</script>