Обновить содержимое iframe с помощью ajax Post request

Question

Я делаю свой Rich текстовый редактор.У меня есть текстовая область и фрейм.Я хочу обновить содержимое iframe, щелкнув по какой-нибудь кнопке, и запрос на публикацию ajax передает ему значение textareas.Вот мой HTML-код:

<textarea name="myTextarea" id="text" cols="100" rows="10"></textarea><br>
<br>
<input type="button" value="B" onclick="formatText (myTextarea,'b');" />
<input type="button" value="I" onclick="formatText (myTextarea,'i');" />
<input type="button" value="U" onclick="formatText (myTextarea,'u');" />
<input type="button" value="P" onclick="formatText (myTextarea,'p');" />
<input type="button" value="strike" onclick="formatText (myTextarea,'strike');"/>
<input type="button" value="h1" onclick="formatText (myTextarea,'h1');" />
<input type="button" value="h2" onclick="formatText (myTextarea,'h2');" />
<input type="button" value="h3" onclick="formatText (myTextarea,'h3');" />
<input type="button" value="h4" onclick="formatText (myTextarea,'h4');" />
<input type="button" value="h5" onclick="formatText (myTextarea,'h5');" />
<input type="button" value="h6" onclick="formatText (myTextarea,'h6');" />
<input type="button" value="center" onclick="alignText (myTextarea,'center');" />
<input type="button" value="left" onclick="alignText (myTextarea,'left');" />
<input type="button" value="right" onclick="alignText (myTextarea,'right');" />
<input type="button" value="justify" onclick="alignText (myTextarea,'justify');" />
<input type="button" value="preview" onclick="view(document.getElementById('text').value)">
<br><br><br>
<iframe id="upload_target" name="upload_target" src="#" style="width:1000px;height:1000px;border:2px;opacity:0;filter:alpha(opacity=0);"></iframe>

А вот функция просмотра js:

function view(str)
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  terms = "text="+str;
xmlhttp.onreadystatechange=function()
  {
      if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById('upload_target').innerHTML="";
            jQuery.noConflict();
            (function($) {
            $('#upload_target').append(xmlhttp.responseText);
            })(jQuery);
        }
  }
  xmlhttp.open("POST","print1.php",true);
  xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xmlhttp.send(terms);
document.getElementById('upload_target').style.opacity=1;
}

Я не могу поместить свою текстовую область в форму и нацелить ее на iframe при отправке событияпотому что приведенный выше код является лишь частью всего моего кода, и он уже находится внутри формы.И вложенные формы не разрешены со стандартами w3c. Спасибо за ответы.

Answer 1

Проблема заключалась в способе запроса содержимого iframes.Правильный метод:

document.getElementById("upload_target").contentWindow.document.body.innerHTML=x‌​mlhttp.responseText;

Он поддерживается во всех основных браузерах.

Answer 2

Почему вы не можете просто получить iframe и изменить URL с помощью параметров get после выполнения запроса ajax? Если ваш iframe работает только с GET. Вы также можете инициировать POST-запросы в iframe, создав фиктивную форму и отправив ее из javascript. Больше ответов здесь