asp.net mvc中的Javascript打印div内容_Javascript_Jquery_Asp.net_Asp.net Mvc_Printing

asp.net mvc中的Javascript打印div内容

javascript jquery asp.net asp.net-mvc printing

asp.net mvc中的Javascript打印div内容,javascript,jquery,asp.net,asp.net-mvc,printing,Javascript,Jquery,Asp.net,Asp.net Mvc,Printing,Html: <div id="printDiv" class="table-responsive"> @Html.Raw(Model.Content) </div> <button type="button" onclick="Print()">Print</button> 当我点击“打印”按钮时，我想打印div内容。但若我点击“打印”按钮，我会看到下面的javascript代码异常 Uncaught TypeEr

Html:

 <div id="printDiv" class="table-responsive">

        @Html.Raw(Model.Content)

    </div>

<button type="button" onclick="Print()">Print</button>

当我点击“打印”按钮时，我想打印div内容。但若我点击“打印”按钮，我会看到下面的javascript代码异常

Uncaught TypeError: undefined is not a function

我不知道我到底错过了什么

任何帮助都将不胜感激。

谢谢。

尝试添加printThis.js

从下面的链接下载js文件

示例代码

<!DOCTYPE html>
  <html>
  <head>
<script src="assets/js/jquery-1.9.1.js"></script>
<script src="assets/js/printThis.js"></script>
<style>
        .drag 
    {
      width: 100px;
      height: 100px;
      background-color: #000;
    }

    #box
    {
      width: 500px;
      height: 400px;
      background-color:red;
    }
</style>
</head>

<body>

  <div id="box">
        <div id="drag">aaaaaaaaaaaaaaaaa</div>
    </div>

    <script>
        $("#drag").printThis()
    </script>


</body>

</html>


拖曳
{
宽度：100px；
高度：100px；
背景色：#000；
}
#盒子
{
宽度：500px；
高度：400px；
背景色：红色；
}
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
$（“#拖动”）。打印此（）

1-将此javascript代码粘贴到asp.net Web表单或asp.net MVC视图中

<script type="text/javascript">

    function PrintElem(elem)
    {
        Popup($(elem).html());
    }

    function Popup(data)
    {
        var mywindow = window.open('', 'divprint', 'height=400,width=600');
        mywindow.document.write('<html><head><title></title>');
        /*optional stylesheet*/ //mywindow.document.write('<link rel="stylesheet" href="main.css" type="text/css" />');
        mywindow.document.write('</head><body >');
        mywindow.document.write(data);
        mywindow.document.write('</body></html>');

        mywindow.document.close(); // necessary for IE >= 10
        mywindow.focus(); // necessary for IE >= 10

        mywindow.print();
        mywindow.close();

        return true;
    }

</script>


函数PrintElem（elem）
{
弹出（$（elem.html（））；
}
功能弹出窗口（数据）
{
var mywindow=window.open（“”，'divprint'，'height=400，width=600'）；
mywindow.document.write（“”）；
/*可选样式表*///mywindow.document.write（“”）；
mywindow.document.write（“”）；
mywindow.document.write（数据）；
mywindow.document.write（“”）；
mywindow.document.close（）；//对于IE>=10是必需的
mywindow.focus（）；//IE>=10所必需的
mywindow.print（）；
mywindow.close（）；
返回true；
}

2-创建打印按钮：

<table class="table table-bordered">
    <tr>
     <td style="text-align:center">
     <input type="submit" value="Print " onclick="PrintElem('#divprint')" 
        class="btn btn-danger" />
        </td>
    </tr>
</table>

3-命名您需要打印的div id

<div id="divprint"> 
// your code to print 
</div>


//要打印的代码

请您帮忙感谢这项工作。想知道为什么这个人没有投票就接受了这个答案。不管怎样，我投我的票。

<div id="divprint"> 
// your code to print 
</div>