使用图像id保存图像为png, jpg和pdf

链接- http://demo.crazewebconsultants.net/bag/customization.php

<div class="customizationbag">
    <div class="container">
        <div class="row">
            <div class="col-lg-2 col-md-2 col-sm-3 col-xs-12">
                <div class="thumbimg">
                    <ul class="list-unstyled">
                        <li class="timgare"><img src="images/F.jpg" class="dummy_data"></li>
                        <li class="timgare"><img src="images/L.jpg" class="dummy_data"></li>
                        <li class="timgare"><img src="images/R.jpg" class="dummy_data"></li>
                        <li class="timgare"><img src="images/B.jpg" class="dummy_data"></li>
                    </ul>
                </div>
            </div>
            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                <div class="custbigimg">
                    <img src="images/F.jpg" class="img-responsive">
                </div>
            </div>
            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                <div class="custbtnare">
                    <ul class="list-unstyled">
                        <li><button type="button" class="btn btn-primary"><i class="fa fa-upload" aria-hidden="true"></i> <p>Upload</p></button></li>
                        <li class="dropsave"><button type="button" class="btn btn-primary svoption"><i class="fa fa-floppy-o" aria-hidden="true"></i><p>Save</p></button>
                        <ul class="svop list-unstyled">
                            <li><a href="#">Save as PNG</a></li>
                            <li><a href="#">Save as JPG</a></li>
                            <li><a href="#">Save as PDF</a></li>
                        </ul>
                        </li>
                        <li><a href="javascript:void(0);" id="print_button2" class="btn btn-primary"><i class="fa fa-print" aria-hidden="true"></i><p>Print</p></a></li>
                        <li><button type="button" class="btn btn-primary"><i class="fa fa-cart-plus" aria-hidden="true"></i><p>Add to Cart</p></button></li>
                    </ul>
                </div>
                <div class="qntare">
                    <form class="form-inline">
                      <div class="form-group">
                        <label>Quantity :</label>
                        <input type="text" class="form-control" value="1">
                      </div>
                        <div class="form-group">
                        <label>Price :</label>
                        <p>$200</p>
                      </div>
                    </form>
                </div> 
            </div>
        </div>
    </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
   $('.thumbimg .dummy_data').click(function(){
      $(".custbigimg img").attr("src",$(this).attr("src"));
   });
});
</script>
<script>
    $(document).ready(function(){
         $("#print_button2").click(function(){
            var mode = 'iframe'; // popup
            var close = mode == "popup";
            var options = { mode : mode, popClose : close};
            $("div.custbigimg").printArea( options );
        });
    });
  </script>

我只是想通过使用onclick作为png, jpg和pdf保存图像。有人能帮帮我吗?使用imagid，我想用onclick保存那个特定的图像。如果有人告诉我唯一一个保存系统，比如png，那对我来说是可以的。