模态编辑框

多层弹框设计




    
    Title

    




    添加
    

        

            1.1.1.11
            80
            
                编辑 | 删除
            
        

        

            1.1.1.12
            80
            
                编辑 | 删除
            
        

        

            1.1.1.13
            80
            
                编辑 | 删除
            
        

        

            1.1.1.14
            80
            
                编辑 | 删除

内容操作:




    
    Title



    
asdfadfasdfasdfasd

上图：通过dom可以获取标签的html和text内容

上图：通过jQuery来获取表现的html和text内容

上图：不添加参数是获取值，添加参数就是赋值。让html等于p标签，且修改内容等于123123

上图：html可以解析标签，text不解析标签，将

当做内容展现出来了。




    
    Title



    
asdfadfasdfasdfasd

上图：input标签通过.value获取填写的值

上图：通过jQuery获取input标签的值

上图：jQuery设置值

$().val() 不知可以获取和设置input标签，只要dom.value能做的，jQuery的val都能操作。




    
    Title

    




    添加
    

        

            1.1.1.11
            80
            
                编辑 | 删除
            
        

        

            1.1.1.12
            80
            
                编辑 | 删除
            
        

        

            1.1.1.13
            80
            
                编辑 | 删除
            
        

        

            1.1.1.14
            80
            
                编辑 | 删除

上图：因为prevall，所以是从编辑开始向左查询，编辑左边下标0的内容是80，下标1的内容是1.1.1.11




    
    Title

    




添加


    

        1.1.1.11
        80
        
            编辑 | 删除
        
    

    

        1.1.1.12
        80
        
            编辑 | 删除
        
    

    

        1.1.1.13
        80
        
            编辑 | 删除
        
    

    

        1.1.1.14
        80
        
            编辑 | 删除

代码说明：

$('.model input[type="text"]').val("");  当点击编辑后，在去点击添加，弹出的弹框中不是空数据，而是之前点击的编辑数据，所以这里在点取消后要将框中的内容清除。

var port = $(tds[0]).text();  根据下标获取文本内容
var host = $(tds[1]).text();

$('.model input[name="hostname"]').val(host);   使用val()进行赋值
$('.model input[name="port"]').val(port);