jQuery UI 대화 상자 + 스크립트를 사용한 WebKit + HTML 응답

다시 한번 큰 문제에 직면했습니다! 내가 링크가, 클라이언트 측에서jQuery UI 대화 상자 + 스크립트를 사용한 WebKit + HTML 응답

: :)

그래서, 여기에 물건입니다. jQuery를 클릭하면 서버에 에게 요청을 보내고 응답을 HTML 콘텐츠로 가져온 다음 해당 콘텐츠로 UI 대화 상자를 팝업합니다.

function preview(){ 
    $.ajax({ 
     url: "/api/builder/", 
     type: "post", 
     //dataType: "html", 
     data: {"script_tpl": $("#widget_code").text(), 
       "widgets": $.toJSON(mwidgets), 
       "widx": "0"}, 
     success: function(data){ 
      //console.log(data) 
      $("#previewArea").dialog({ 
       bgiframe: true, 
       autoOpen: false, 
       height: 600, 
       width: 600, 
       modal: true, 
       buttons: { 
        "Cancel": function() { 
           $(this).dialog('destroy'); 
           } 
       } 
      }); 
      //console.log(data.toString()); 
      $('#previewArea').attr("innerHTML", data.toString()); 
      $("#previewArea").dialog("open"); 
     }, 
     error: function(){ 
      console.log("shit happens"); 
     } 
    }) 
}

응답 (data) 인 :

보시다시피

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript">var smakly_widget_sid = 0 ,widgets = [{"cols": "2","rows": "2","div_id": "smakly_widget","wid": "0","smakly_style": "small_image",}, ] </script> <script type="text/javascript" src="/media/js/smak/smakme.js"></script> </head> <body> preview <div id="smakly_widget" style="width:560px;height:550px"> </div> </body> </html>

가, 부하에 스크립트가 : smakme.js, 어떻게 든 여기

요청 기능의 코드 은 WebKit 기반 브라우저 (Safari와 Chrome에서 사용해 보았습니다)에서 실행되지 않지만 Firefox, Internet Explorer 및 Opera에서는 예상대로 작동합니다!

String.prototype.format = function(){ 
    var pattern = /\{\d+\}/g; 
    var args = arguments; 
    return this.replace(pattern, function(capture){ return args[capture.match(/\d+/)]; }); 
} 

var turl = "/widget" 

var widgetCtrl = new(function(){ 

    this.render_widget = function (w, content){ 
     $("#" + w.div_id).append(content); 
    } 

    this.build_widgets = function(){ 
     for (var widx in widgets){ 
      var w = widgets[widx], 
       iurl = '{0}?sid={1}&wid={2}&w={3}&h={4}&referer=http://ya.ru&thrash={5}'.format(
        turl, 
        smakly_widget_sid, 
        w.wid, 
        w.cols, 
        w.rows, 
        Math.floor(Math.random()*1000).toString()), 
       content = $('<iframe src="{0}" width="100%" height="100%"></iframe>'.format(iurl)); 
      this.render_widget(w, content); 
     } 
    } 
}) 

$(document).ready(function(){ 
    widgetCtrl.build_widgets(); 
})

그 어떤 보안 문제, 또는 어떤 다른가요 : 여기

는 해당 스크립트입니까?

출처

2010-03-04 Anton Koval'

응답에 jQuery에 대한 참조가 필요하다고 생각합니다 (어떤 경우에도 해를 입히지 않습니다).

HTML 및 JavaScript를 로컬에 저장하여 문제를 재현하려고 시도했으며 jQuery에 대한 참조에 삽입해야했습니다. 나는 에 jQuery를의 구글 버전을 참조를 사용 오른쪽 meta에 선 후 삽입 :

<script 
    type="text/javascript" 
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"> 
</script>

그러나 나는 파이어 폭스 3.6과 구글 크롬 3.0.195.38 사이의 차이를 보지 못했다. jQuery 참조가 포함될 때 Google 크롬에서 스크립트가 긍정적으로 실행되었습니다.

응답의 재 포맷 된 버전 (JQuery와 관계없이)이다

<html> 
    <head> 
     <meta 
      http-equiv="Content-Type" 
      content="text/html; charset=UTF-8"> 
     <script type="text/javascript"> 
      var smakly_widget_sid = 0 , 
       widgets = 
       [ 
        { 
        "cols": "2", 
        "rows": "2", 
        "div_id": "smakly_widget", 
        "wid": "0", 
        "smakly_style": "small_image", 
        }, 
       ] 
     </script> 

     <script 
      type="text/javascript" 
      src="/media/js/smak/smakme.js"> 
     </script> 
    </head> 

    <body> 
     preview 
     <div 
      id="smakly_widget" 
      style="width:560px;height:550px"> 
     </div> 
    </body> 
</html>

출처

2010-03-05 20:09:58

jQuery UI 대화 상자 + 스크립트를 사용한 WebKit + HTML 응답

답변

관련 문제