modal/divにajaxレスポンスを表示 - レスポンスがウェブページ形式の場合

私はajaxコールを実行しています。ユーザーが提供するURLが有効かどうかを確認するためにping操作をしています。それはGETまたはPOST要求である可能性があります。私はユーザーにget/post要求の応答を表示したいので、応答を表示するためにポップアップモーダルを使用しています。しかし、レスポンスがウェブページの形であれば、（レスポンスウェブページのCSSスタイルのために）私の元のページのCSSスタイルを乱すことになります。 は、スタイルは、次のmodal/divにajaxレスポンスを表示 - レスポンスがウェブページ形式の場合

乱されていないので、私は、私のWebページから、この特定のdivの別々のを隔離することができる方法はありchar変数で提供URLを検証するためのコードの断片（ValidateURLは、URLとリターンを検証し、残りのAPIです応答及び応答コード）

function validateURL(char){ 
    var value = char.value; 
    $.ajax({ 
      url: "/FrugalPlatform/validateURL.action", 
      type: "POST", 
      data: { 
       url: value, 
       protocol : protocol, 
      }, 
      success: function(data) { 
       $("#response").html(data.response); 
       $("#modalForResponse").modal(); 
      } 
    }); 
}

特定の応答が返されるの数を含むウェブページ

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html xmlns="//www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 
<meta http-equiv="Content-Language" content="en-us" /> 
<link rel="shortcut icon" 
href="//dnassets-mauganscorp.netdna-ssl.com/images/favicon.ico" /> 
<link rel="search" type="application/opensearchdescription+xml" 
title="Desktop Nexus" href="//www.desktopnexus.com/opensearch.xml"> 
... 
...

ました...私のWebページのスタイルをめちゃくちゃにされをリンクされたリソース...

snapshot of one such scenario

出典

2017-05-28 Tushar Lone

私は直接の代わりに使用してイム..スタイルを乱すたdiv要素の中にHTML応答を入れしようとしていました今iframe、それは

responseFrameがIFRAME

のIDである

var doc = document.getElementById('responseFrame').contentWindow.document; 
doc.open(); 
doc.write(data.response); 
doc.close();

として動的コンテンツ情報変更

出典

2017-05-29 08:50:25

modal/divにajaxレスポンスを表示 - レスポンスがウェブページ形式の場合

答えて

関連する問題