87,990
社区成员
发帖
与我相关
我的任务
分享js 能不能把现有鼠标选择状态改到别处
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<link rel="stylesheet" href="./css/bootstrap.min.css">
<script src="jquery-1.11.1.min.js"></script>
<script src="./js/bootstrap.min.js"></script>
<style>
.page2_div_1{
position: absolute;
width:20%;
height:95%;
left: 2.5%;
top: 2.4%;
border:1px solid #DCDCDC;
border-radius:10px;
}
.page2_div_1_up{
position: absolute;
width:100%;
height:20%;
left: 0%;
top: 0%;
border:1px solid #DCDCDC;
border-radius:10px;
}
.page2_div_1_down{
position: absolute;
width:100%;
height:80%;
left: 0%;
top: 20%;
border:1px solid #DCDCDC;
border-radius:10px;
}
.pre-scrollable{
max-height: 100%;
min-height: 100%;
overflow-y: auto;
}
</style>
</head>
<body>
<div class="tab-pane active" id="kecheng">
<div class="page2_div_1">
<div class="page2_div_1_up">
<button class="btn btn-default" id="page2_newcreatebtn">新建名称</button>
<button class="btn btn-default" id="altersubjectname">修改名称</button>
<button class="btn btn-default" id="upname">名称上移</button>
</div>
<div class="page2_div_1_down">
<ul class="nav nav-pills nav-stacked pre-scrollable" id="page2_div_1_down_ul">
</ul>
</div>
</div>
</body>
<script>
window.onload = function(){
//新建名称
var j = 0;
var page2_newcreatebtn = document.getElementById("page2_newcreatebtn");
page2_newcreatebtn.onclick = function(){
var page2_div_1_down_ul = document.getElementById("page2_div_1_down_ul");
if(page2_div_1_down_ul.getElementsByTagName("li").length == 0){
var createli = document.createElement("li");
var createa = document.createElement("a");
createa.href = "#"+ j;
createa.index = j;
j = j + 1;
createa.dataset.toggle = "tab";
var text = document.createTextNode("undefined");
createa.appendChild(text);
createli.appendChild(createa);
page2_div_1_down_ul.appendChild(createli);
}else{
var createli = document.createElement("li");
var createa = document.createElement("a");
createa.href = "#" + j;
createa.index = j;
j = j + 1;
createa.dataset.toggle = "tab";
var text = document.createTextNode("undefined");
createa.appendChild(text);
createli.appendChild(createa);
page2_div_1_down_ul.appendChild(createli);
}
}
//新建名称
//修改名称
var selectA = null;
$("#page2_div_1_down_ul").on("click", "a", function(e){
selectA = this;
});
var altersubjectname = document.getElementById("altersubjectname");
altersubjectname.onclick = function(){
if (selectA) {
var name = prompt("请输入您的名字", selectA.text);
selectA.text = name;
} else {
alert("没有选中");
}
}
//修改名称
//名称上移
var upname = document.getElementById("upname");
var page2_div_1_down_ul = document.getElementById("page2_div_1_down_ul");
var a = page2_div_1_down_ul.getElementsByTagName("a");
upname.onclick = function(){
if(selectA.index == 0){
alert("无法上移");
}else{
var count = a[selectA.index].text;
a[selectA.index].text = a[selectA.index-1].text;
a[selectA.index-1].text = count;
}
}
}
</script>
</html>
如图，点击名称上移以后，选择状态还是在原来的地方，想让选择状态也能跟着名称一起上移，比如点再点3次上移，就把4移动到1前面。这里就不会了，请高手指教。
...全文
请发表友善的回复…
发表回复
饺子da 2018-12-21
- 打赏
- 举报
解决了 加一个威信行吗 以后有问题我直接给你钱 27131026
天际的海浪 2018-12-21
- 打赏
- 举报
var count = a[selectA.index].text;
a[selectA.index].text = a[selectA.index-1].text;
a[selectA.index-1].text = count;
selectA = a[selectA.index-1];
$(selectA).closest("li").addClass("active").siblings().removeClass("active");
饺子da 2018-12-21
- 打赏
- 举报
这个被选择的效果还是没有改变，我就是想连同这个被选择的效果一起改变了。天际的海浪 2018-12-21
- 打赏
- 举报
}else{
var count = a[selectA.index].text;
a[selectA.index].text = a[selectA.index-1].text;
a[selectA.index-1].text = count;
selectA = a[selectA.index-1];
}
