账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    在 vue外部js中使用document取不到div的id,请教各位
    32
    0

    html:
    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta

    content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
    name="viewport">

    <link rel="stylesheet" href="../../css/bootstrap.min.css">
    <link rel="stylesheet" href="../../css/font-awesome.min.css">
    <link rel="stylesheet"

    href="../../plugins/jqgrid/ui.jqgrid-bootstrap.css">

    <link rel="stylesheet"

    href="../../plugins/ztree/css/metroStyle/metroStyle.css">

    <link rel="stylesheet" href="../../css/main.css">
    <script src="../../libs/jquery.min.js"></script>
    <script src="../../plugins/layer/layer.js"></script>
    <script src="../../libs/bootstrap.min.js"></script>
    <script src="../../libs/vue.min.js"></script>
    <script src="../../plugins/jqgrid/grid.locale-cn.js"></script>
    <script src="../../plugins/jqgrid/jquery.jqGrid.min.js"></script>
    <script src="../../plugins/ztree/jquery.ztree.all.min.js"></script>
    <script src="../../js/common.js"></script>
    </head>

    <style>
    .detailsDiv{

    background-color:#fff;

    }
    .page_lable_class{

    margin-top:8px

    }
    .layer_div_class{

    margin-top:10px;
    margin-bottom:10px;

    }
    .div1{
    padding-top: 20px;
    width:100%;
    padding-left: 100px;
    }
    .div2{
    display: inline-block;
    }
    .div3{
    display: inline-block;
    padding-left: 250px;
    }
    </style>

    <body>

    <div id="metasystem_page" v-cloak>
        <div v-show="showList">
            <div class="grid-btn">
                <div class="form-group col-sm-2">
                    <input type="text" class="form-control"
                        v-model="meta_system.metaName" @keyup.enter="query"
                        placeholder="元数据名称">
                </div>
                <a class="btn btn-default" @click="query">查询</a> <a
                    v-if="hasPermission('generator:metasystem:save')"
                    class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
                <a v-if="hasPermission('generator:metasystem:update')"
                    class="btn btn-primary" @click="update"><i
                    class="fa fa-pencil-square-o"></i>&nbsp;修改</a> <a
                    v-if="hasPermission('generator:metasystem:delete')"
                    class="btn btn-primary" @click="del"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
            </div>
            
            <table id="jqGrid"></table>
            <div id="jqGridPager"></div>
        </div>
    
        <div v-show="!showList" class="panel panel-default">
            <div class="panel-heading">{{title}}</div>
            <div>
                <ul class="nav nav-tabs">
                <li id="stand_lab" @click="standardinfo" role="presentation" class="active"><a
                    href="#standardinfo" target="contentFrame" aria-controls="repeat"
                    data-toggle="tab">基本信息</a></li>
                <li id ="relation_lab" @click="correlativity" role="presentation"><a
                    href="#onlyOne" target="contentFrameonly" aria-controls="onlyOne"
                    data-toggle="tab">关系配置</a></li>
            </ul>
            </div>
            <div v-show="labelType==1" class="" align="">
            <form class="form-horizontal" style="width:100%;" >
                <div style="width:100%;padding-left: 100px;" >
                <div class="" style="display: inline-block;" >
                    <div class="">元数据类型 :<span class="mandatory">*</span></div><br>
                    <div class="" style="padding: 0px">
                    <input id="metaTypePlace" type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.typeName" @click="metaTypeTree" readonly="readonly" placeholder="点击选择元数据类型"/>
                    </div>
                </div>
                <div class="" style="display: inline-block;padding-left: 250px;"  >
                    <div class="">数据对象名称 :<span class="mandatory">*</span></div><br>
                    <div class="" style="padding: 0px">
                        <input type="text" class="form-control" style="width: 280px;cursor:pointer;"
                            v-model="metaSystem.metaName" placeholder="请填写元数据名称" />
                    </div>
                </div>
                </div>
                <div style="padding-top: 20px;width:100%;padding-left: 100px;" >
                <div class="" style="display: inline-block;" >
                    <div class="">数据对象代码 :<span class="mandatory">*</span></div><br>
                    <div class="" style="padding: 0px">
                        <input type="text" class="form-control" style="width: 280px;cursor:pointer;"
                            v-model="metaSystem.metaCode" placeholder="请填写元数据代码" />
                    </div>
                </div>
                <div class="" style="display: inline-block;padding-left: 250px;"  >
                    <div class="">父对象 :</div><br>
                    <div class="" style="padding: 0px">
                    <input id="parentIdPlace" type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.parentName" @click="parentIdTree" readonly="readonly" placeholder="点击选择父对象"/>
                    
                    </div>
                </div>
                <div>
                <code style="margin-top:4px;display: block;">注:有*标识的为必填信息</code>
                </div>
                </div>
                
                <div id="strInputForm" v-for="item in metaStrs" >
                        <div class="form-group" style=""  v-show="'str1'==item.metaObjField" > <div class="" >str1:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str1"></div></div>    
                        <div class="form-group" style=""  v-show="'str2'==item.metaObjField" > <div class="" >str2:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str2"></div></div>
                        <div class="form-group" style="" v-show="'str3'==item.metaObjField" > <div class="" >str3:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str3"></div></div>
                        <div class="form-group" style="" v-show="'str4'==item.metaObjField" > <div class="" >str4:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str4"></div></div>
                        <div class="form-group" style="" v-show="'str5'==item.metaObjField" > <div class="" >str5:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str5"></div></div>
                        <div class="form-group" style="" v-show="'str6'==item.metaObjField" > <div class="" >str6:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str6"></div></div>
                        <div id="str7" class="form-group" style="" v-show="'str7'==item.metaObjField" > <div class="" >str7:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str7"></div></div>
                        <div class="form-group" style="" v-show="'str8'==item.metaObjField" > <div class="" >str8:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str8"></div></div>
                        <div id="str9" class="form-group" style="" v-show="'str9'==item.metaObjField" > <div class="" >str9:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str9"></div></div>
                        <div class="form-group" style="" v-show="'str10'==item.metaObjField"> <div class=""  >str10:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str10"></div></div>
                        <div id="str11" class="form-group" style="" v-show="'str11'==item.metaObjField"> <div class=""  >str11:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str11"></div></div>
                        <div class="form-group" style="" v-show="'str12'==item.metaObjField"> <div class=""  >str12:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str12"></div></div>
                        <div id="str13" class="form-group" style="" v-show="'str13'==item.metaObjField"> <div class=""  >str13:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str13"></div></div>
                        <div class="form-group" style="" v-show="'str14'==item.metaObjField"> <div class=""  >str14:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str14"></div></div>
                        <div class="form-group" style="" v-show="'str15'==item.metaObjField"> <div class=""  >str15:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str15"></div></div>
                        <div class="form-group" style="" v-show="'str16'==item.metaObjField"> <div class=""  >str16:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str16"></div></div>
                        <div class="form-group" style="" v-show="'str17'==item.metaObjField"> <div class=""  >str17:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str17"></div></div>
                        <div class="form-group" style="" v-show="'str18'==item.metaObjField"> <div class=""  >str18:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str18"></div></div>
                        <div class="form-group" style="" v-show="'str19'==item.metaObjField"> <div class=""  >str19:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str19"></div></div>
                        <div class="form-group" style="" v-show="'str20'==item.metaObjField"> <div class=""  >str20:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str20"></div></div>
                        <div class="form-group" style="" v-show="'str21'==item.metaObjField"> <div class=""  >str21:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str21"></div></div>
                        <div class="form-group" style="" v-show="'str22'==item.metaObjField"> <div class=""  >str22:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str22"></div></div>
                        <div class="form-group" style="" v-show="'str23'==item.metaObjField"> <div class=""  >str23:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str23"></div></div>
                        <div class="form-group" style="" v-show="'str24'==item.metaObjField"> <div class=""  >str24:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str24"></div></div>
                        <div class="form-group" style="" v-show="'str25'==item.metaObjField"> <div class=""  >str25:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str25"></div></div>
                        <div class="form-group" style="" v-show="'str26'==item.metaObjField"> <div class=""  >str26:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str26"></div></div>
                        <div class="form-group" style="" v-show="'str27'==item.metaObjField"> <div class=""  >str27:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str27"></div></div>
                        <div class="form-group" style="" v-show="'str28'==item.metaObjField"> <div class=""  >str28:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str28"></div></div>
                        <div class="form-group" style="" v-show="'str29'==item.metaObjField"> <div class=""  >str29:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str29"></div></div>
                        <div class="form-group" style="" v-show="'str30'==item.metaObjField"> <div class=""  >str30:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str30"></div></div>
                        <div class="form-group" style="" v-show="'str31'==item.metaObjField"> <div class=""  >str31:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str31"></div></div>
                        <div class="form-group" style="" v-show="'str32'==item.metaObjField"> <div class=""  >str32:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str32"></div></div>
                        <div class="form-group" style="" v-show="'str33'==item.metaObjField"> <div class=""  >str33:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str33"></div></div>
                        <div class="form-group" style="" v-show="'str34'==item.metaObjField"> <div class=""  >str34:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str34"></div></div>
                        <div class="form-group" style="" v-show="'str35'==item.metaObjField"> <div class=""  >str35:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str35"></div></div>
                        <div class="form-group" style="" v-show="'str36'==item.metaObjField"> <div class=""  >str36:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str36"></div></div>
                        <div class="form-group" style="" v-show="'str37'==item.metaObjField"> <div class=""  >str37:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str37"></div></div>
                        <div class="form-group" style="" v-show="'str38'==item.metaObjField"> <div class=""  >str38:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str38"></div></div>
                        <div class="form-group" style="" v-show="'str39'==item.metaObjField"> <div class=""  >str39:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str39"></div></div>
                        <div class="form-group" style="" v-show="'str40'==item.metaObjField"> <div class=""  >str40:</div><br><div class="col-sm-10" ><input type="text" class="form-control" style="width: 280px;cursor:pointer;" v-model="metaSystem.str40"></div></div>            
                </div>
                
                
                
                <div class="form-group" style="padding-left: 850px;" >
                    <div class="col-sm-2 control-label"></div>
                    <input type="button" class="btn btn-primary" @click="saveOrUpdate"
                        value="确定" /> &nbsp;&nbsp;<input type="button"
                        class="btn btn-warning" @click="reload" value="返回" />
                </div>
            </form>
            </div>
        </div>
            <div id="detailsLayer" style="background-color: #ccc; display: none">
        <div class="col-sm-9">
            <div>
                <div class="form-inline">
                    <div class="col-sm-6 form-group layer_div_class">
                        <label class="col-sm-4" for="metaNameIdLayer">元数据名称</label> <input
                            readonly="readonly" type="text" class="col-sm-8 form-control"
                            id="metaNameIdLayer" v-model="metaSystemLayer.metaName">
                    </div>
                    <div class="col-sm-6 form-group layer_div_class">
                        <label class="col-sm-4" for="metaTypeIdLayer">元数据类型</label>
                        <input readonly="readonly" type="text"
                            class="col-sm-8 form-control" id="metaTypeIdLayer"
                            v-model="metaSystemLayer.typeName">
                            
                    </div>
                </div>
                <div class="form-inline">
                    <div class="col-sm-6 form-group layer_div_class">
                        <label class="col-sm-4" for="namespaceIdLayer">元数据路径</label> <input
                            readonly="readonly" type="text" class="col-sm-8 form-control"
                            id="namespaceIdLayer" v-model="metaSystemLayer.namespace">
                    </div>
                    <div class="col-sm-6 form-group layer_div_class">
                        <label class="col-sm-4" for="metaCodeLayer">元数据代码</label> <input
                            readonly="readonly" type="text" class="col-sm-8 form-control"
                            id="metaCodeLayer" v-model="metaSystemLayer.metaCode">
                    </div>
                </div>
                <div class="form-inline">
                    <div class="col-sm-6 form-group layer_div_class">
                    <label class="col-sm-4" for="metaCodeLayer">创建时间</label> <input
                            readonly="readonly" type="text" class="col-sm-8 form-control"
                            id="metaCodeLayer" v-model="metaSystemLayer.createTime">
                    </div>
                    <div class="col-sm-6 form-group layer_div_class" style="hidden:true">
                    </div>
                </div>
            </div>
        </div>
    </div>
            <!-- 选择数据类型 -->
        <div id="metaTypeLayer" style="display: none;padding:10px;">
            <ul id="menuTypeTree" class="ztree"></ul>
        </div>
                    <!-- 选择父ID -->
        <div id="parentIdLayer" style="display: none;padding:10px;">
            <ul v-show="showBlankTree" id="parentIdTree" class="ztree"></ul>
            <span v-show="!showBlankTree">当前元数据类型没有可以选择的父节点</span>
        </div>
    </div>
    <script src="../../js/modules/metamanage/metasystem.js"></script>

    </body>
    </html>

    vuejs:
    metaTypeTree: function() { //获取元数据类型

            layer.open({
                type: 1,
                offset: '50px',
                skin: 'layui-layer-molv',
                title: "选择元数据类型",
                area: ['300px', '450px'],
                shade: 0,
                shadeClose: false,
                content: jQuery("#metaTypeLayer"),
                btn: ['确定', '取消'],
                btn1: function(index) {
                    var node = metaTypeZtree.getSelectedNodes();
                    vm.metaSystem.metaType = node[0].id;
                    vm.metaSystem.typeName = node[0].typeName;
                    type_id = node[0].id;
                    $.ajax({
                        type: "POST",
                        dataType: "json",
                        url: baseURL + "/generator/metasystem/queryStrInput",
                        data: {
                            'metatype': node[0].id
                        },
                        success: function(r) {
                            vm.metaStrs = r.strinputlist;
                            
                            for(var i =0;i<r.strinputlist.length;i++){ 
                                if(i%2==0){
                                    var id = r.strinputlist[i].metaObjField;
                                    var obj = document.getElementById(id);
                                    obj.style.cssText = "display: inline-block;";
                                }else{
                                    var id = r.strinputlist[i].metaObjField;
                                    var obj = document.getElementById(id);
                                    obj.style.cssText = "display: inline-block;padding-left: 250px;";
                                }
                                } 
                            
                            
                        }
                    });
    
                    layer.close(index);
                }
            });
        },
    1
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 敏哥哥 普通会员 1楼
      502 Bad Gateway

      502 Bad Gateway


      nginx
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部