bootstrap和JS相关

最新推荐文章于 2024-03-12 13:45:02 发布

o王o

最新推荐文章于 2024-03-12 13:45:02 发布

阅读量578

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/u012129607/article/details/81353869

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

下表列出了模态框中要用到事件。这些事件可在函数中当钩子使用。

bootstrap 显示隐藏div


            $('.show-info').click(function () {
                var show = $(this).data('show');
                if(show =='all'){
                    $('#creative').show();
                    $('#plan').show();
                    $('#plan').attr('class','col-lg-6');
                    $('#creative').attr('class','col-lg-6');
                    return false;
                }
                if(show =='plan'){
                    $('#plan').show();
                    $('#plan').attr('class','col-lg-12');
                    $('#creative').hide();
                    return false;
                }
                if(show =='creative'){
                    $('#creative').show();
                    $('#creative').attr('class','col-lg-12');
                    $('#plan').hide();
                    return false;
                }
            });

bootstarp弹窗DIV隐藏时监测触发事件

       //监测弹窗是否隐藏
            $('#accounts-modal').on('hide.bs.modal', function () {
                $('#wrapper').css('position', 'relative');
            });

show.bs.modal   在调用 show 方法后触发。 
$('#identifier').on('show.bs.modal', function () {
  // 执行一些动作...
})
shown.bs.modal  当模态框对用户可见时触发（将等待 CSS 过渡效果完成）。   
$('#identifier').on('shown.bs.modal', function () {
  // 执行一些动作...
})
hide.bs.modal   当调用 hide 实例方法时触发。   
$('#identifier').on('hide.bs.modal', function () {
  // 执行一些动作...
})
hidden.bs.modal 当模态框完全对用户隐藏时触发。 
$('#identifier').on('hidden.bs.modal', function () {
  // 执行一些动作...
})

bootstrap 设置滚动条

jQuery ajax中使用serialize() 方法提交表单数据

https://blog.csdn.net/fangquan1980/article/details/79667477
异步方式：
HTML

Js
$.ajax({ type: “POST”, url:url, data:$ (‘#formID’).serialize(),// 要提交的表单
success: function(msg) {alert(msg);}
});
同步方式：

$("#exceldown").click(function() {

    var data5 = [];

    //获取当前页的数据行
    var rows = $('#month_report').datagrid('getRows');
    for (var i = 0; i < rows.length; i++) {
        var params = {};
        params.name=rows[i]["AREANAME"];
        for(var j=0;j<colData4.length;j++){
            var a = colData4[j]["field"];
            params[j]=rows[i][a];

        }
        data5[i]=params;
    }
    if (data5 == '')
        return;
    // 创建Form
    var form = $('<form></form>');
    // 设置属性
    form.attr('action', '<e:url value='excelData/down.e'/>');
    form.attr('method', 'post');

    // 创建Input
    var my_input = $('<input  name="my_name" type="hidden" />');
    my_input.attr('value',  JSON.stringify(data5));
    // 附加到Form
    form.append(my_input);
    $(document.body).append(form);
    // 提交表单
    form.submit();

});

js获取input框的值

Js代码 :
$(“div[id]”) 选择所有含有id属性的div元素$ (“input[name=’newsletter’]”) 选择所有的name属性等于’newsletter’的input元素
$(“input[name!=’newsletter’]”) 选择所有的name属性不等于’newsletter’的input元素$ (“input[name^=’news’]”) 选择所有的name属性以’news’开头的input元素
$("input[name$ =’news’]”) 选择所有的name属性以’news’结尾的input元素
$(“input[name*=’man’]”) 选择所有的name属性包含’news’的input元素$ ("input[id][name$=’man’]”) 可以使用多个属性进行联合选择，该选择器是得到所有的含有id属性并且那么属性以man结尾的元素