How to get the image without using input file with jquery

0

I'm learning a bit of jquery and what I want to do is get an image to crop the image but without using the input file.

              <div class="image-editor">
                                    <div id="estado"></div>
                                    <input type='file' id='image' class='cropit-image-input'/> 
                                    <div  class="cropit-preview"></div>
                                    <div class="image-size-label">
                                      Resize image
                                    </div>
                                    <input type="range" class="cropit-image-zoom-input">
                                    <button class="rotate-ccw">Rotate counterclockwise</button>
                                    <button class="rotate-cw">Rotate clockwise</button>

                                    <button class="export">Export</button>

                                    <script type="text/javascript">
                                         $(function() {

                                            $('.image-editor').cropit({

                                              exportZoom: 1.25,
                                              imageBackground: true,
                                              imageBackgroundBorderWidth: 20

                                            });

                                        $('.rotate-cw').click(function() {
                                          $('.image-editor').cropit('rotateCW');
                                        });
                                        $('.rotate-ccw').click(function() {
                                          $('.image-editor').cropit('rotateCCW');
                                        });

                                        $('.export').click(function() {
                                          var imageData = $('.image-editor').cropit('export');
                                          alert(imageData);
                                        });
                                      });
                                    </script>

as you can see, the jquery code gets the image from the input file <input type='file' id='image' class='cropit-image-input' />

$('.image-editor').cropit({

                                          exportZoom: 1.25,
                                          imageBackground: true,
                                          imageBackgroundBorderWidth: 20

                                        });

here the capture through your class, but what I want is another way to capture that image without using the input file, since I tried to put the address of the image in an input text or capture directly with the id from a <img> but it does not work for me.

I hope you can help me.

    
asked by Mtac 17.10.2018 в 08:58
source

0 answers