js动态生成的button添加onclick事件 代码如下 想要实现的效果是勾选食物后生成 米饭+1- 点击加号值加1
<scripttype="text/javascript">//selectthis(obj,i);functionselectthis(obj,i){alert(i);...
<script type="text/javascript">
//selectthis(obj,i);
function selectthis(obj,i)
{
alert(i);
var bs=document.getElementsByTagName("input");
if(obj.checked==true)
{alert(1);
// var content=document.getElementById("content");
//alert(text);
var btnjian=document.createElement("input");//生成减号；
//alert(btnjian);
btnjian.type="button";
btnjian.value="-";
var btnjia=document.createElement("input");//生成加号
btnjia.type="button";
btnjia.value="+";
var foodname=document.createElement("input");//生成选中的食物名
foodname.type="text";
foodname.value=i;
content.appendChild(foodname);
content.appendChild(btnjia);
content.appendChild(btnjian);
var bs = document.getElementsByTagName("input");
alert(bs);
for(var i=0;i<bs.length;i++){
var b=bs[i];
alert(bs[1]);
b.setAttribute("aaa",i);
b.onclick=function(){
//var s=confirm("我是"+this.getAttribute("aaa")+"号，是否值加一");
var x=0;
var a=document.createElement("input");
a.type="text";
a.value=++x;
alert(x);
//document.getElementById("content").innerHTML+="</br><input name =\"1\"type=\"text\" onclick=\"click()\" value=\"按钮\"><\input>";
//selectthis();
}
}}
}
</script>
</head>
<body>
<div id="select">
种类：<br/>
<input type="checkbox" value="馒头" onClick="selectthis(this,this.value)" name="items">馒头<br/>
<input type="checkbox" value="油饼" onClick="selectthis(this,this.value)" name="items">油饼<br/>
<input type="checkbox" value="油条" onClick="selectthis(this,this.value)" name="items">油条<br/>
</div>
已选：
<div id="content">
</div>
</body>
</html> 展开
//selectthis(obj,i);
function selectthis(obj,i)
{
alert(i);
var bs=document.getElementsByTagName("input");
if(obj.checked==true)
{alert(1);
// var content=document.getElementById("content");
//alert(text);
var btnjian=document.createElement("input");//生成减号；
//alert(btnjian);
btnjian.type="button";
btnjian.value="-";
var btnjia=document.createElement("input");//生成加号
btnjia.type="button";
btnjia.value="+";
var foodname=document.createElement("input");//生成选中的食物名
foodname.type="text";
foodname.value=i;
content.appendChild(foodname);
content.appendChild(btnjia);
content.appendChild(btnjian);
var bs = document.getElementsByTagName("input");
alert(bs);
for(var i=0;i<bs.length;i++){
var b=bs[i];
alert(bs[1]);
b.setAttribute("aaa",i);
b.onclick=function(){
//var s=confirm("我是"+this.getAttribute("aaa")+"号，是否值加一");
var x=0;
var a=document.createElement("input");
a.type="text";
a.value=++x;
alert(x);
//document.getElementById("content").innerHTML+="</br><input name =\"1\"type=\"text\" onclick=\"click()\" value=\"按钮\"><\input>";
//selectthis();
}
}}
}
</script>
</head>
<body>
<div id="select">
种类：<br/>
<input type="checkbox" value="馒头" onClick="selectthis(this,this.value)" name="items">馒头<br/>
<input type="checkbox" value="油饼" onClick="selectthis(this,this.value)" name="items">油饼<br/>
<input type="checkbox" value="油条" onClick="selectthis(this,this.value)" name="items">油条<br/>
</div>
已选：
<div id="content">
</div>
</body>
</html> 展开
2个回答
展开全部
<script type="text/javascript">
function selectthis(obj){
var content=document.getElementById("content");
if(obj.checked){
var btnjian=document.createElement("input");
btnjian.type="button";
btnjian.value="-";
btnjian.setAttribute("fid",obj.id);
btnjian.onclick=function(){
var fdiv=document.getElementById("f"+this.getAttribute("fid"));
var fnum=fdiv.getElementsByTagName("input")[0];
if(fnum.value>1)fnum.value-=1;
}
var btnjia=document.createElement("input");
btnjia.type="button";
btnjia.value="+";
btnjia.setAttribute("fid",obj.id);
btnjia.onclick=function(){
var fdiv=document.getElementById("f"+this.getAttribute("fid"));
var fnum=fdiv.getElementsByTagName("input")[0];
fnum.value=parseInt(fnum.value)+1;
}
var num=document.createElement("input");
num.type="text";
num.value=1;
var foodname=document.createTextNode(obj.value);
var box=document.createElement("div");
box.id="f"+obj.id;
box.appendChild(foodname);
box.appendChild(num);
box.appendChild(btnjia);
box.appendChild(btnjian);
content.appendChild(box);
}else{
var box=document.getElementById("f"+obj.id);
content.removeChild(box);
}
}
</script>
<div id="select">
种类：<br/>
<input id="f1" type="checkbox" value="馒头" onClick="selectthis(this)" name="items">馒头<br/>
<input id="f2" type="checkbox" value="油饼" onClick="selectthis(this)" name="items">油饼<br/>
<input id="f3" type="checkbox" value="油条" onClick="selectthis(this)" name="items">油条<br/>
</div>
已选：
<div id="content"></div>
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
function selectthis(obj,i)
{
var id="";
switch(i){
case '馒头':id="MT";break;
case '油饼':id="YB";break;
case '油条':id="YT";break;
}
if(obj.checked==true)
{
var content=document.getElementById("content");
var divElement=document.createElement("div");
divElement.id="List_"+id;
var btnjian=document.createElement("input");//生成减号；
btnjian.type="button";
btnjian.value="-";
btnjian.id="jian_"+id;
btnjian.onclick=function(){
var id= this.id.split('_')[1];
var number=document.getElementById(id).value;
if(number>1){
document.getElementById(id).value=number-1;
}
else{
alert("最少选一件");
}
}
var btnjia=document.createElement("input");//生成加号
btnjia.type="button";
btnjia.value="+";
btnjia.id="jia_"+id;
btnjia.onclick=function(){
var id= this.id.split('_')[1];
var number=parseInt(document.getElementById(id).value);
document.getElementById(id).value=number+1;
}
var foodname=document.createElement("span");//生成选中的食物名
foodname.innerHTML=i;
var foodnumber=document.createElement("input");//生成选中的食物数量
foodnumber.type="text";
foodnumber.value=1;
foodnumber.id=id;
divElement.appendChild(foodname);
divElement.appendChild(btnjia);
divElement.appendChild(foodnumber);
divElement.appendChild(btnjian);
content.appendChild(divElement);
}
else{
var e=document.getElementById("List_"+id);
e.parentNode.removeChild(e);
}
}
{
var id="";
switch(i){
case '馒头':id="MT";break;
case '油饼':id="YB";break;
case '油条':id="YT";break;
}
if(obj.checked==true)
{
var content=document.getElementById("content");
var divElement=document.createElement("div");
divElement.id="List_"+id;
var btnjian=document.createElement("input");//生成减号；
btnjian.type="button";
btnjian.value="-";
btnjian.id="jian_"+id;
btnjian.onclick=function(){
var id= this.id.split('_')[1];
var number=document.getElementById(id).value;
if(number>1){
document.getElementById(id).value=number-1;
}
else{
alert("最少选一件");
}
}
var btnjia=document.createElement("input");//生成加号
btnjia.type="button";
btnjia.value="+";
btnjia.id="jia_"+id;
btnjia.onclick=function(){
var id= this.id.split('_')[1];
var number=parseInt(document.getElementById(id).value);
document.getElementById(id).value=number+1;
}
var foodname=document.createElement("span");//生成选中的食物名
foodname.innerHTML=i;
var foodnumber=document.createElement("input");//生成选中的食物数量
foodnumber.type="text";
foodnumber.value=1;
foodnumber.id=id;
divElement.appendChild(foodname);
divElement.appendChild(btnjia);
divElement.appendChild(foodnumber);
divElement.appendChild(btnjian);
content.appendChild(divElement);
}
else{
var e=document.getElementById("List_"+id);
e.parentNode.removeChild(e);
}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
