JavaScript 实现局部打印（动态获取的内容）

第一次写打印，只知道window.print()，但是直接出来的是当前页面的全部内容，而我要作的是打印当前模态框里展现的内容。
网上搜了一下，都是指定具体的div，而后获取该div里的内容赋值给window.document.body.innerHTML

var bodyHtml = window.document.body.innerHTML;
        window.document.body.innerHTML = html;//html为当前显示的div的内容
        window.print();
        window.document.body.innerHTML = bodyHtml;

可是这个就致使了一个问题，若是是<span>打印的内容</span>这样的，能够直接获取打印，但若是是赋值到input标签里的，根本就获取不到值啊。
怎么办，接着搜呗。
找到两种方法，第一种，也是比较原始的：将表单中的数据进行绑定，获取过来从新赋值给对应的input中;

//打印模态框问卷内容
        $('.myform').on('click', 'a[name="printInfo"]', function () {
            $('#listModal').modal('hide');//关闭模态框
            $('#quesInfoModal').modal('hide');
            var weI = this.id;
            onprint(weI);
        });
    });
    //打印指定区域
    function printHtml(html) {
        var bodyHtml = window.document.body.innerHTML;
        window.document.body.innerHTML = html;
        window.print();
        window.document.body.innerHTML = bodyHtml;
        //上面关于bodyHtml赋值的两项操做能够忽略，由于要关闭模态框而且刷新页面
        //这个地方必需要刷新一下页面，打印从新赋值以后，模态框里的功能都不能正常使用，
        包括父页面列表中的功能也失效，这个问题不是很明白，有知道的能够帮忙解决一下
        refreshFrame();//刷新页面
    }
    function onprint(weI) {
        if (weI == 'wenjuanI') {//调查问卷详情
            bindData('#quesInfoModal');
            var html = $('#quesInfoModal').html();
        } else {
            bindData('#listModal');
            var html = $('#listModal').html();
        }

        printHtml(html);
    }
    //将表单中手动填写的数据进行绑定，便于html()的时候获取到  
    function bindData(modalID) {
        //type=text,type=number, 同时若是checkbox,radio,select>option的值有变化, 也绑定一下
        $(modalID + " input[type='text']").each(function () {
            $(this).attr('value', $(this).val());
        });
        $(modalID + " input[type='number']").each(function () {
            $(this).attr('value', $(this).val());
        });
         $(modalID + " input,select option").each(function(){  
            $(this).attr('value',$(this).val());  
        });  
        //type=checkbox,type=radio 选中状态  
        $(modalID + " input[type='radio']").each(function () {
            if ($(this).attr('placeholder')) {//$(this).attr('checked')
                $(this).attr('checked', true);
            } else {
                $(this).removeAttr('checked');
            }
        });
        $(modalID + " input[type='checkbox']").each(function () {
            if ($(this).attr('placeholder')) {//$(this).attr('checked')
                $(this).attr('checked', true);
            } else {
                $(this).removeAttr('checked');
            }
        });

        //$('.modal-backdrop').each(function () {//关闭模态框的遮罩层
        //    $(this).removeClass('in');
        //});
    }

注意：这种方法，必需要刷新一下页面，打印从新赋值以后，模态框里的功能都不能正常使用，包括父页面列表中的功能也失效，（至关于页面变成了一个纯静态页面，没有js了）这个问题不是很明白，有知道的能够帮忙解决一下啦
第二种方法，我看网上有说用jqprint插件的（http://www.jq22.com/jquery-in...），这个我也没有详细的看，只是稍微试了一下，也是不能获取到input的值，并且隐藏的div也一并给显示出来的了，效果很差，有会的能够指教一下啊。