bootstrap-fileinput.jsArnold Daniels によるファイル入力プレビューに使用しています。jquery.Jcrop.jsそして、ケリー・ホールマンによるクロッピングのために。
bootstrap-fileinput選択した画像をライブ プレビューするには、画像srcエンコード データ URL に挿入します。このようなものdata:image/png;base64,iVBORw.......
ユーザーが写真を選択してライブプレビューを取得すると、その画像をトリミングできるようにしたいと考えました。私は追加のボタンでそれをやろうとしました: ユーザーが画像を選択するとライブプレビューが表示され、ボタン「クロップ」をクリックすると、追加された画像に対してJcropスクリプトが初期化されます。( $img_wrapper.find('img').Jcrop({});)。そして、それはうまくいきます。
しかし、「クロップ」ボタンを押さずに同じことをしようとすると、ファイルが選択された後に自動的に機能しません。私が理解しているように、jQuery は新しいイメージを認識しません。
私はイベントで試しましたが、うまくいきませんon.('click', func...。次に、独自のリスナーを提供するドキュメント ( http://jasny.github.io/bootstrap/javascript/#fileinput ) で見つけましたが、それでも機能しません。ボタン「クロップ」を使用すると、正常に機能しますが、自動的に機能しません。なぜですか?Jcropon.('change.bs.fileinput', funct...
したがって、そのように機能します：（画像を選択して「トリミング」を押すと、画像をトリミングできます） http://jsfiddle.net/8f44yo9v/2/
しかし、そのようには機能しません: http://jsfiddle.net/o7tbr6mo/