zoukankan      html  css  js  c++  java
  • 前台bootstrap按钮动态添加与删除

    1.动态添加与删除按钮

    initCourse: function(){
    $("#add").click(function(){
    addCourse(this,courseInfosMax);
    });

    function addCourse(obj,sm){
    $('#courseInfos').append(
         '<div>'+
         '<div class="form-group">'+'<label class="control-label col-md-1">课程名称<span class="required"> * </span></label>'+
        '<div class="col-md-2"><input type="text" class="form-control" name="courseName" placeholder="请输入课程名称"></div>'
        +' <label class="control-label col-md-1">教师名称<span class="required"> * </span></label>'+
         '<div class="col-md-2"><input type="text" class="form-control" name="teacherName" placeholder="请输入教师名称"></div>'+
         '<div class="col-md-2"><input type="button" class="btn red stop-btn" value="删除"/></div>'+'</div>'+'</div>').find("input.stop-btn").click(function(){
        $(this).parent().parent().remove();
       $('input#add').show();
     });
     }
    }

     

    点击添加课程

     

    2.谷歌调试页面element选项下

    由于删除是在第二层的div 里面,所以是用$(this).parent().parent().remove();或者$(this).closet(.form-group).remove();可以删除

    点击删除,又回到最开始的界面

     

  • 相关阅读:
    iOS app版本更新CheckVersion_Swift
    ios插件化开发
    开源框架RSA_Swift
    iOS SKStoreProductViewController的应用
    FMDB的使用
    iOS的MVP设计模式
    iOS UI帧率优化经验
    SKStoreReviewController之程序内评价
    Axure使用chrome插件
    修改每次《创建》项目maven仓库的默认路径
  • 原文地址:https://www.cnblogs.com/xiaolin-peter/p/7195910.html
Copyright © 2011-2022 走看看