• 左右添加和删除


    自己写的一个网页里面的删除和新增的js。逻辑过于复杂,而且不能实现所有的功能。但是也是自己的一些成果。有借鉴的可以问问我
    //点击的是二级权限
    $(".select").click(function () {
    var m = 0;
    //阻止事件冒泡
    var e = event || window.event;
    if (e.stopPropagation) {
    e.stopPropagation();
    }
    else {
    e.cancelBubble = true;
    }
    //冒泡结束
    var l = $(this).parent().parent().find("li input").length;
    // selected2 = $(this).parent().parent().find("li").eq(0)[0];
    for (var i = 0; i < l; i++) {
    if ($(this).parent().parent().find("li input").eq(i)[0].checked == true) {
    m++;
    }
    }
    if (m == l) {
    $(this).parent().parent().prev().find("input")[0].checked = true;
    } else {
    $(this).parent().parent().prev().find("input")[0].checked = false;
    }
    })

    //点击的是一级权限
    $(".selectParent").click(function () {
    //阻止事件冒泡
    var e = event || window.event;
    if (e.stopPropagation) {
    e.stopPropagation();
    }
    else {
    e.cancelBubble = true;
    }
    if ($(this)[0].checked === true) {
    isChecked($(this));
    } else {
    cancelChecked($(this));

    }

    })

    //点击的是Li标签
    $(".selectTr").click(function () {
    var m = 0;
    if ($(this).find("input")[0].checked === false) {
    $(this).find("input")[0].checked = true;
    } else {
    $(this).find("input")[0].checked = false;
    }
    var l = $(this).parent().find("li input").length;
    for (var i = 0; i < l; i++) {
    if ($(this).parent().find("li input").eq(i)[0].checked == true) {
    m++;
    }
    }
    if (m == l) {
    $(this).parent().prev().find("input")[0].checked = true;
    } else {
    $(this).parent().prev().find("input")[0].checked = false;
    }

    })

    function cancelChecked($dom) {
    var l = $dom.parent().next().find("li input").length;
    for (var i = 0; i < l; i++) {
    $dom.parent().next().find("li input").eq(i)[0].checked = false;
    }
    }

    function isChecked($dom) {
    abc = $dom.parent().next().find("li");
    var l = $dom.parent().next().find("li input").length;
    for (var i = 0; i < l; i++) {
    $dom.parent().next().find("li input").eq(i)[0].checked = true;
    }
    }

    $("#add").click(function () {
    addOrDelete($("#ok"));
    //添加到右边
    })


    function addOrDelete($dom) {
    var l = $dom.find(".information").length;
    console.log(l);
    var arr = [];
    //这里有两种情况,第一种当第一级选中的时候直接把父级和子级以及push到arr里面。第二种当父级没选中的时候遍历里面的子级然后push到arr中
    for (var i = 0; i < l; i++) {
    var tr = [];
    var trL = $dom.find(".information").eq(i).next().find("li a").length;
    if ($dom.find(".information").eq(i).find("input")[0].checked == true) {
    for (var j = 0; j < trL; j++) {
    tr.push($dom.find(".information").eq(i).next().find("li a").eq(j).html());
    }
    arr.push({
    th: $dom.find(".information").eq(i).html().replace(/<input type="checkbox" class="selectParent">/g, ""),
    tr: tr
    });
    console.log("lianggeyiqi:" + arr);
    console.log(arr);
    console.log(99999);
    } else {
    for (var j = 0; j < trL; j++) {
    if ($dom.find(".information").eq(i).next().find("li input").eq(j)[0].checked === true) {
    tr.push($dom.find(".information").eq(i).next().find("li a").eq(j).html());
    }
    }
    if (tr.length > 0) {
    arr.push({
    th: $dom.find(".information").eq(i).html().replace(/<input type="checkbox" class="selectParent">/g, ""),
    tr: tr
    });
    }
    }
    }
    addToLOR(arr, $dom);
    for (var i = l - 1; i >= 0; i--) {
    console.log(123456789);
    var trL = $dom.find(".information").eq(i).next().find("li a").length;
    if ($dom.find(".information").eq(i).find("input")[0].checked == true) {
    //移除左边的勾选内容
    $dom.find("div").eq(i).remove();
    } else {
    for (var j = trL - 1; j >= 0; j--) {
    if ($dom.find(".information").eq(i).next().find("li input").eq(j)[0].checked === true) {
    $dom.find(".information").eq(i).next().find("li").eq(j).remove();
    }
    }
    }
    }
    }

    //添加到右边或则左边
    function addToLOR(arr, $dom) {
    var str = "";
    var isHava = 0;//0表示没有一样的头。否则有
    var dijige = 0;
    var $other = "";
    if ($dom[0].id == 'addOrDel') {
    $other = $('#ok');
    } else {
    $other = $('#addOrDel');

    }
    for (var i = 0; i < arr.length; i++) {

    //遍历数组然后查询已经添加的里面有没有一样的头部,如果没有就直接加整个div。不然把添加的内容加到对应的ul里面去。
    for (var m = 0; m < $other.find("div").length; m++) {
    console.log($other.find("div").eq(m).find("a:first-child"));
    if ($other.find("div").eq(m).find("a:first-child").html().replace(/<input type="checkbox" class="selectParent">/g, "") == arr[i].th) {
    isHava++;
    dijige = m;
    }
    }
    if (isHava == 0) {
    str = ' <div id="user2"><a class="one information"><input type="checkbox" class="selectParent">' + arr[i].th + '</a>';
    str += ' <ul class="kid">';
    for (var j = 0; j < arr[i].tr.length; j++) {
    str += ' <li class="selectTr"><b class="tip"></b><input type="checkbox" class="select"><a';
    str += ' target="Conframe"';
    str += ' href="html/UserCostinfo.html"';
    str += ' class="select">' + arr[i].tr[j] + '</a></li>';
    }
    str += ' </ul>';
    str += ' </div>';
    console.log(str);
    $other.append(str);
    } else {
    console.log(arr[i].tr);
    console.log("changdu:" + arr[i].tr.length);
    for (var j = 0; j < arr[i].tr.length; j++) {
    str += ' <li class="selectTr"><b class="tip"></b><input type="checkbox" class="select"><a';
    str += ' target="Conframe"';
    str += ' href="html/UserCostinfo.html"';
    str += ' class="select">' + arr[i].tr[j] + '</a></li>';
    }
    console.log(str);
    $other.find("div ul").eq(dijige).append(str);
    }
    }

    //点击的是二级权限
    $(".select").click(function () {
    var m = 0;
    //阻止事件冒泡
    var e = event || window.event;
    if (e.stopPropagation) {
    e.stopPropagation();
    }
    else {
    e.cancelBubble = true;
    }
    //冒泡结束
    var l = $(this).parent().parent().find("li input").length;
    // selected2 = $(this).parent().parent().find("li").eq(0)[0];
    for (var i = 0; i < l; i++) {
    if ($(this).parent().parent().find("li input").eq(i)[0].checked == true) {
    m++;
    }
    }
    if (m == l) {
    $(this).parent().parent().prev().find("input")[0].checked = true;
    } else {
    $(this).parent().parent().prev().find("input")[0].checked = false;
    }
    })

    //点击的是一级权限
    $(".selectParent").click(function () {
    //阻止事件冒泡
    var e = event || window.event;
    if (e.stopPropagation) {
    e.stopPropagation();
    }
    else {
    e.cancelBubble = true;
    }
    if ($(this)[0].checked === true) {
    isChecked($(this));
    } else {
    cancelChecked($(this));

    }

    })

    //点击的是Li标签
    $(".selectTr").click(function () {
    var m = 0;
    if ($(this).find("input")[0].checked === false) {
    $(this).find("input")[0].checked = true;
    } else {
    $(this).find("input")[0].checked = false;
    }
    var l = $(this).parent().find("li input").length;
    for (var i = 0; i < l; i++) {
    if ($(this).parent().find("li input").eq(i)[0].checked == true) {
    m++;
    }
    }
    if (m == l) {
    $(this).parent().prev().find("input")[0].checked = true;
    } else {
    $(this).parent().prev().find("input")[0].checked = false;
    }

    })

    function cancelChecked($dom) {
    var l = $dom.parent().next().find("li input").length;
    for (var i = 0; i < l; i++) {
    $dom.parent().next().find("li input").eq(i)[0].checked = false;
    }
    }

    function isChecked($dom) {
    abc = $dom.parent().next().find("li");
    var l = $dom.parent().next().find("li input").length;
    for (var i = 0; i < l; i++) {
    $dom.parent().next().find("li input").eq(i)[0].checked = true;
    }
    }

    }


    // 这里做的是删除刚刚添加的不必要的选项
    $("#cancel").click(function () {
    addOrDelete($('#addOrDel'));
    })

    })
  • 相关阅读:
    模块的种类和导入方法
    小知识点补充
    9.17模拟赛2.0
    hdu2181 哈密顿绕行世界问题
    9.17模拟赛
    9.15模拟赛
    P1084 疫情控制
    9.14模拟赛
    【bzoj1232】[Usaco2008Nov]安慰奶牛cheer
    P3128 [USACO15DEC]最大流Max Flow
  • 原文地址:https://www.cnblogs.com/dragonh/p/6285735.html
Copyright © 2020-2023  润新知