zoukankan      html  css  js  c++  java
  • 左右添加和删除

    自己写的一个网页里面的删除和新增的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'));
    })

    })
  • 相关阅读:
    winform+c#之窗体之间的传值 Virus
    ASP.NET 2.0 利用 checkbox获得选中行的行号, 在footer中显示 Virus
    .NET中的winform的listview控件 Virus
    我的书橱
    Expert .NET 2.0 IL Assembler·译者序一 写在一稿完成之即
    Verbal Description of Custom Attribute Value
    AddressOfCallBacks in TLS
    下一阶段Schedule
    2008 Oct MVP OpenDay 第二天 博客园聚会
    2008 Oct MVP OpenDay 第二天 颁奖·讲座·晚会
  • 原文地址:https://www.cnblogs.com/dragonh/p/6285735.html
Copyright © 2011-2022 走看看