狂ってる。私はこのサイトで、ユーザーが youtube の埋め込みコードを画面上のテキスト領域に貼り付けることができるクライアントを開発中です。「追加」をクリックすると、コードがオブジェクトのプロパティに配置され、それが配列の最後にプッシュされます。次に、ビデオの「リスト」が表示され、さらに追加するための「新規」ボタンがあります。ページの [新規] ボタンをクリックして 2 つ目を追加するとすぐに、IE がフリーズします。私は IE 9 を試しました - ほぼ 100% の時間で動作します - 一度動作しましたが、最初に他のものを追加しました。
IE10 は正常に動作しているようですが、以前に問題が発生していた可能性がありますが、今夜は問題ないようです。
更新: Windows XP で IE8 をテストしました - 問題ありません。
多くのデバッグの後、iframeが560ピクセル以上の場合、クラッシュするという非常識な結論に実際に達したと思います...サイズを550に変更しても問題ありません...問題のiframe実際にはページ上にありません (プレビューすることはできますが、デフォルトでは表示されず、ページに挿入されることさえありません)。
その他のメモ:
単純な iframe を src 属性だけで挿入しようとしましたが、問題はありません。
大量のhtmlを挿入しようとしました-問題ありません。
INVALID html を挿入してみました - 問題ありません。
YouTube のコードを取得し、URL を変更しました - 問題が発生しました。
YouTubeのコードを手で再入力しようとしました-問題の問題がありました(これを試したときに、奇妙なエンコーディングまたは何かを望んでいました.)
このサイトは完成に近づいています。
あなたの便宜のために、私は実際にこれを見るためにサイトをセットアップしました:
最初にログインする必要があります:
ユーザー名: test@testers.com
パスワード: test1234
次に、/submit に進むか、ナビゲーションの [車を売る] をクリックし、次のページで [すぐに出品] をクリックします。
すぐに [YouTube 動画] タブに移動して、それを試すことができます。タブ間を移動する必要はありません...
ここにいくつかのコードがあります (CoffeeScript & Jade - JavaScript & HTML はサイトで見ることができます...)
コントローラーの早い段階で、ビデオ リストを空の配列に初期化します。
$scope.formData =
videos: []
新しいビデオが送信されたときに呼び出されるメソッドは次のとおりです (わずかに編集されています)。
$scope.addVideo = ->
v = {
id: 0
code: $scope.new_video.code
listing_id: $scope.listing_id
}
$scope.formData.videos.push v
$scope.new_video.adding = false # hides the "add" form.
$scope.new_video.code = ''
リスト エディターで動画タブをレンダリングする HTML (これには AngularUI Bootstrap を使用しています)
pane(heading="YouTube Videos", active="panes.videoActive")
div(ng-show="new_video.adding || !formData.videos.length")
h4 Add Video
p Paste the embed code from YouTube to add video:
textarea(ng-model="new_video.code")
br
a.btn.btn-primary(ng-click="addVideo()") <i class="icon-save"></i> Add Video
|
a.btn.btn-danger(ng-click="new_video.adding = false;new_video.code=''") <i class="icon-trash"></i> Cancel
div(ng-show="!new_video.adding && formData.videos.length")
.row-fluid
.span6
h4 YouTube Videos
.btn-group
button.btn.btn-small.btn-success(ng-click="new_video.adding = true") <i class="icon-plus"></i> New
button.btn.btn-small.btn-info(ng-show="listing_id>0", ng-click="saveVideoOrder()",ng-disabled="new_video.saving_sort") <i class="icon-save"></i> Save Order
i.icon-spinner.icon-spin(ng-show="new_video.saving_sort")
ul.unstyled.video-list(ui-sortable, ng-model="formData.videos")
li(ng-repeat="v in formData.videos",style="position:relative;padding-left:16px")
span(style="position:absolute;top:0;left:0;cursor:ns-resize") <i class="icon-resize-vertical"></i>
textarea(ng-model="v.code")
.btn-group
button.btn.btn-danger(ng-click="deleteVideo(v)", ng-disabled="new_video.deleting") <i class="icon-trash"></i> Delete
span(ng-show="new_video.deleting")
i.icon-spinner.icon-spin
button.btn.btn-info(ng-click="new_video.preview_code=v.code") <i class="icon-eye-open"></i> Preview
button.btn.btn-primary(ng-click="v = updateVideo(v)", ng-disabled="v.updating") <i class="icon-save"></i> Update
i.icon-spinner.icon-spin(ng-show="v.updating")
.span6(ng-show="new_video.preview_code")
h4 Preview
a.btn.btn-danger.btn-mini(ng-click="new_video.preview_code = false")
i.icon-eye-close
| Close
div(ng-bind-html-unsafe="new_video.preview_code")
参考までに: ほとんどのサイトが完成しました。Angular は、サインアップ、プロフィール、車の提出、メッセージング システム、クレジット申請などのフォームのフロント エンドでのみ使用されます。管理者は完全なAngularアプリですが、それを確認するにはクライアントと仕事を得る必要があります-そしてそれでも-私にはわかりません! =)