jquery實(shí)現(xiàn)權(quán)限分配

在網(wǎng)上看到很多權(quán)限分配的代碼,大都用js做的,并且覺得很復(fù)雜,用jquery完全可以實(shí)現(xiàn)一樣的功能,并且代碼很簡潔。

薩爾圖網(wǎng)站制作公司哪家好,找創(chuàng)新互聯(lián)!從網(wǎng)頁設(shè)計、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、自適應(yīng)網(wǎng)站建設(shè)等網(wǎng)站項(xiàng)目制作,到程序開發(fā),運(yùn)營維護(hù)。創(chuàng)新互聯(lián)公司2013年成立到現(xiàn)在10年的時間,我們擁有了豐富的建站經(jīng)驗(yàn)和運(yùn)維經(jīng)驗(yàn),來保證我們的工作的順利進(jìn)行。專注于網(wǎng)站建設(shè)就選創(chuàng)新互聯(lián)

js部分:

<script type="text/javascript">
//全部右添加
function cutAllRight(callback){
$("#select1 option").appendTo("#select2");
callback();
}
//全部左添加
function cutAllLeft(callback){
$("#select2 option").appendTo("#select1");
callback();
}
//右添加
function cutRight(callback){
$("#select1 option:selected").appendTo("#select2");
callback();
}
//左添加
function cutLeft(callback){
$("#select2 option:selected").appendTo("#select1");
callback();
}
//上移動
function upEvent(){
var option = document.getElementById("select2").getElementsByTagName("option");
for(var i=0;i<option.length;i++){
if(option[i].selected&&i!=0){
option[i-1].selected=true;
option[i].selected=false;
break;
}
}
}
//下移動
function downEvent(){
var option = document.getElementById("select2").getElementsByTagName("option");
for(var i=0;i<option.length;i++){
if(option[i].selected&&i!=(option.length-1)){
option[i+1].selected=true;
option[i].selected=false;
break;
}
}
}
//雙擊添加
function doubleClick1(n,callback){
if(n==1){
$("#select1 option:selected").appendTo("#select2");
callback();
}
else if(n==2){
$("#select2 option:selected").appendTo("#select1");
callback();
}
}
</script>
<script type="text/javascript">

</script>
<script type="text/javascript">
function addDiv(){
$("#span1").html($("#select2 option").length);
}
function AllRight(){
cutAllRight(addDiv);
}
function Right(){
cutRight(addDiv);
}
function Left(){
cutLeft(addDiv);
}
function AllLeft(){
cutAllLeft(addDiv);
}
function doubleClick(n){
doubleClick1(n,addDiv);
}
function selectOut(obj){
obj.oncontextmenu=function(){
var option = document.getElementsByTagName("option");
for(var i=0;i<option.length;i++){
option[i].selected=false;
}
}
}
</script>

jsp頁面

<div >
<div>已選擇<span id="span1">0</span>人</div>
<div class="div2" >
<select multiple="multiple" id="select1" ondblclick="doubleClick(1)" onmouseover="selectOut(this)">
<option value="趙培沛">趙培沛</option>
<option value="陳帥">陳帥</option>
<option value="梁國棟">梁國棟</option>
<option value="程洪濤">程洪濤</option>
<option value="馬祥然">馬祥然</option>
<option value="李森">李森</option>
<option value="侯俊杰">侯俊杰</option>
</select>
</div>
<div class="div3">
<div><img src="p_w_picpath/ico/bullet_arrow_top1.png" onclick="AllRight()"/></div>
<div><img src="p_w_picpath/ico/bullet_arrow_down1.png" onclick="Right()"/></div>
<div><img src="p_w_picpath/ico/bullet_arrow_up1.png" onclick="Left()"/></div>
<div><img src="p_w_picpath/ico/bullet_arrow_bottom1.png" onclick="AllLeft()"/></div>
</div>
<div class="div2" >
<select multiple="multiple" id="select2" ondblclick="doubleClick(2)" onmouseover="selectOut(this)">
</select>
</div>
<div class="div3">
<div>&nbsp;</div>
<div>&nbsp;</div>
<div><img src="p_w_picpath/ico/bullet_arrow_up.png" onclick="upEvent()"/></div>
<div><img src="p_w_picpath/ico/bullet_arrow_down.png" onclick="downEvent()"/></div>
</div>
</div>

其中自己加上向左,全左,向右,全右,向上,向下的6張圖片即可。加上jquery的庫文件

進(jìn)×××流: 178483774

當(dāng)前題目:jquery實(shí)現(xiàn)權(quán)限分配
分享網(wǎng)址:http://muchs.cn/article22/jcjijc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供ChatGPT面包屑導(dǎo)航、網(wǎng)站建設(shè)、品牌網(wǎng)站設(shè)計域名注冊、靜態(tài)網(wǎng)站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

微信小程序開發(fā)