⑴ 以下代码里,怎么样用JS增添一个删除键,删除购物车内对应的商品
<!doctypehtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>Document</title>
<style>
*{margin:0;padding:0;}
#div_idp{width:80px;height:30px;text-align:left;border:1pxsolid#000;line-height:30px;}
#div_idpbutton{float:right;height:30px;}
</style>
<scriptsrc="js/tool.js"></script>
<script>
window.onload=function(){
vardiv=document.getElementById("div_id");
varbutton=document.getElementsByTagName("button")
for(vari=0;i<button.length-1;i++){
button[i].onclick=function(){
alert("加入购物车成功");
varp=document.createElement("p");
varpContent=document.createTextNode(this.innerHTML);
p.appendChild(pContent);
div.appendChild(p);
vardelBtn=document.createElement("button");
vardelBtnContent=document.createTextNode("x");
delBtn.appendChild(delBtnContent);
p.appendChild(delBtn);
delBtn.onclick=function(){
div.removeChild(p);
}
//setCookie("购物",div.innerHTML,getDate(100))
}
}
varisTrue=false;
varbutton1=document.getElementById("button_id")
button1.onclick=function(){
if(isTrue==false){
button1.innerHTML="隐藏购物车"
isTrue=true;
/*if(getCookie("购物")!=undefined){
div.innerHTML=getCookie("购物");
}*/
div.style.display="block";
}elseif(isTrue){
button1.innerHTML="显示购物车"
isTrue=false;
div.style.display="none";
/*if(getCookie("购物")!=undefined){
div.innerHTML=getCookie("购物");
div.style.display="none";
}*/
}
}
}
</script>
</head>
<body>
<button>商品1</button>
<button>商品2</button>
<button>商品3</button>
<button>商品4</button>
<button>商品5</button><br/><br/>
<buttonid="button_id">显示购物车</button>
<divid="div_id"style="display:none;"></div>
</body>
</html>
⑵ 如何用JS实现多选框select的全选和取消全选
你自己改下控件名字就可以了啊!
下面自己放连个文件试
---
1.php
<script>
function $(id){
return document.getElementById(id);
}
function checkalls(obj,form){
var bool=(obj.checked)?true:false;
for(var i=0;i<form.length;i++){
form.all[i].selected=bool;
}
}
</script>
<form action="2.php" method="post" >
<input type="checkbox" name="checkall" id="checkall" onclick="checkalls(this,$('select'))" checked>全选<br>
<select multiple name="select[]" id="select" size="15" style="width:210px;height:250px">
<option value="1" selected>顿饭大幅度</option>
<option value="2" selected>大幅度</option>
<option value="3" selected>大幅缩</option>
<option value="4" selected>到司法所</option>
</select>
<INPUT TYPE="submit" value="提交">
</form>
---
2.php
<?
echo $select[0];
echo $select[1];
echo $select[2];
echo $select[3];
?>
⑶ 跪求各位js高手,怎么修改可以删除全选或选中的内容
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>javascript实现全选</title>
</head>
<body>
<form>
<inputtype="checkbox"id="checkAll"/>全选/全不选
<label><inputtype="checkbox"name="item"value="足球">足球</label>
<label><inputtype="checkbox"name="item"value="篮球">篮球</label>
<label><inputtype="checkbox"name="item"value="排球">排球</label>
</form>
<buttonid="del">删除</button>
<scripttype="text/javascript">
window.onload=function(){
varcheck_All=document.getElementById("checkAll");
vari_tem=document.getElementsByName("item");
check_All.onclick=function(){
varflag=this.checked;
for(vari=0;i<i_tem.length;i++){
i_tem[i].checked=flag;
}
}
for(vari=0;i<i_tem.length;i++){
i_tem[i].onclick=function(){
varnum=0;
for(varj=0;j<i_tem.length;j++){
if(i_tem[j].checked){
num++;
}
}
check_All.checked=i_tem.length==num?true:false;
}
}
varform=document.getElementsByTagName('form')[0];
vardel=document.getElementById('del');
varlabel=document.getElementsByTagName('label');
del.onclick=function(){
for(vari=i_tem.length-1;i>-1;i--){
if(i_tem[i].checked){
form.removeChild(label[i]);
}
}
}
}
</script>
</body>
</html>
⑷ js写全选,怎么取消一个checkbox的选中状态,让全选的checkbox选中状态取消
写判断。
1.点击全选时是把所有的项加上checked
2.获取这个checked的数量
3.当checked数量不等于全部项的数量时,就把全选按钮的checked属性设为false
⑸ 跪求各位js高手,怎么修改可以把全选或选中的内容删除
functionselall(obj){
vartems=document.getElementsByName("item");
for(vari=0;i<tems.length;i++){
tems[i].checked=obj.checked;
}
}
functionreverse(){
vartems=document.getElementsByName("item");
for(vari=0;i<tems.length;i++){
tems[i].checked=!tems[i].checked;
}
}
<form>
<inputtype="checkbox"id="checkAll"onclick="reverse();"/>反选
<inputtype="checkbox"id="checkAll"onclick="selall(this);"/>全选/全不选
<inputtype="checkbox"name="item"value="足球">足球
<inputtype="checkbox"name="item"value="篮球">篮球
<inputtype="checkbox"name="item"value="排球">排球
</form>
⑹ js 全选删除的bug 不能一次性删完
你的代码我没测试,不过自己写了个测试文件,可以remove掉所有的,你可看看
<!DOCTYPEHTML>
<html>
<head>
<metacharset="UTF-8"/>
<title>Demo</title>
</head>
<scripttype="text/javascript"src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script>
<styletype="text/css">
.select-all{margin-bottom:10px;}
.item{background:#ccc;padding:5px10px;width:100px;text-align:center;}
.act{margin-top:20px;}
.button{border:1pxsolid#ccc;border-radius:5px;background:#FFA54F;padding:5px10px;text-align:center;text-decoration:none;color:#fff;}
</style>
<body>
<div>
<divclass="select-all">
<inputtype="checkbox"onclick="check_all(this)">全选/全不选
</div>
<divid="list">
<divclass="item"><inputtype="checkbox"name="demo"id="1"value="1">Demo1</div>
<divclass="item"><inputtype="checkbox"name="demo"id="2"value="2">Demo2</div>
<divclass="item"><inputtype="checkbox"name="demo"id="3"value="3">Demo3</div>
<divclass="item"><inputtype="checkbox"name="demo"id="4"value="4">Demo4</div>
<divclass="item"><inputtype="checkbox"name="demo"id="5"value="5">Demo5</div>
<divclass="item"><inputtype="checkbox"name="demo"id="6"value="6">Demo6</div>
<divclass="item"><inputtype="checkbox"name="demo"id="7"value="7">Demo7</div>
<divclass="item"><inputtype="checkbox"name="demo"id="8"value="8">Demo8</div>
</div>
<divclass="act">
<ahref="javascript:;"class="button"onclick='remove_parent()'><span>RemoveParent</span></a>
</div>
</div>
</body>
<scripttype="text/javascript">
functioncheck_all(o){
if(o.checked==true){
$('#listinput[name="demo"]').prop('checked',true);
}else{
$('#listinput[name="demo"]').prop('checked',false);
}
}
functionremove_parent(){
varids=get_checked();
$.each(ids,function(i,n){
if($('#'+n).length>0){
$('#'+n).parent().remove();
alert('Remove成功!');
}else{
alert('Remove失败!');
}
});
}
functionget_checked(){
varids=newArray();
$.each($('#listinput:checked'),function(i,n){
if($(n).val()!='0'&&$(n).val()!=''){
ids.push($(n).val());
}
});
returnids;
}
</script>
</html>
以下是测试效果图
希望能帮到你,若有疑问,欢迎追问,望采纳,谢谢!~!
⑺ 用JavaScript代码模拟购物车。
购物车挺复杂的,不是一句两句能说清的,现在前端都用react,vue这类响应式框架做购物车,事半功倍。
⑻ js做了个简单的全选 取消全选 与反选出现了小问题求大佬解答!
您好你这个代码除了一点问题是因为,你再判断下方的赋值逻辑是错的专
你可以把
if(aCh[i].checked==true)
{
aCh[i].checked=false;
}
else
{
aCh[i].checked=true;
}
这里改好就行属了,记住在判断后是要赋值的,不要对比了再对比
⑼ 用js 实现一个checkbox同时能全选和取消的功能
贴一个自己的代码供你参考:
<!DOCTYPEhtml>
<htmllang="en">
<head>
<metacharset="UTF-8">
<title>Title</title>
<scripttype="text/javascript">
window.onload=function(){
function$(id){
returndocument.getElementById(id);
}
varinputArr=document.getElementById("myCBox").getElementsByTagName("input");
functionsel(flag){
for(vari=0;i<inputArr.length;i++){
inputArr[i].checked=flag;
}
}
//全选
$("selAll").onclick=function(){
sel(true);
}
//取消选择
$("cancelSel").onclick=function(){
sel(false);
}
//反选
$("invertSel").onclick=function(){
for(vari=0;i<inputArr.length;i++){
inputArr[i].checked=!inputArr[i].checked;
}
}
}
</script>
</head>
<body>
<buttonid="selAll">全选</button><buttonid="cancelSel">取消全选</button><buttonid="invertSel">反选</button>
<divid="myCBox">
<div><inputtype="checkbox">测试1</div>
<div><inputtype="checkbox">测试2</div>
<div><inputtype="checkbox">测试3</div>
<div><inputtype="checkbox">测试4</div>
<div><inputtype="checkbox">测试5</div>
<div><inputtype="checkbox">测试6</div>
</div>
</body>
</html>
运行效果:
⑽ 用js在JAVA里面做一个全选和删除的功能
var checkboxs = document.getElemenetByName("name")
for(var i=0;i<checkboxs.length;i++){
if(checkbox[i].check==true){
//这个是选中了,自己操作去
}
}
全选的话也用循环,回设置checkbox[i].check=true就可答以了