jQuery ajax和php iframe.形成目标问题


jQuery ajax and php iframe. Form target issue

overflowers这是每日问题。=)

用例&问题描述:

    我正在提交一个表单通过jQuery $.ajax({…})
    • ajax post调用触发php执行SQL插入。
    • SQL查询执行成功,可以在DB上进行检查。
  1. 显示结果没有得到更新iframe
    • 原始按钮附加到使用的表单target="id_of_iframe"*
  2. 相同的url,相同的目标(my_iframe)

  • 我如何更新iframe的结果数据的$。ajax post ?

  • 我应该添加一些其他控件吗?

  • 与iframe兼容的可编辑post数据的其他表单提交方法?

感谢所有提前,有一个美好的编码日:)

代码:

HTML

<html>
  <head>
    ...
  </head>
  <body>
    <!--the iframe -->
    <iframe src ="iframe.php" 
      class="my_iframe" id="my_iframe" 
      name="my_iframe" frameborder="0" allowtransparency="true">
    </iframe>
    <!--the form -->
    <form id="my_form" action="iframe.php" 
     method="post" target="my_iframe">
       <!-- some input fields -->
       <button onclick="my_function"></button>
    </form>
  </body>
</html>

JAVASCRIPT - JQUERY

function my_function(){
   var my_data = .../*go collect form data*/
   $.ajax({
     type: "POST",
     url: "iframe.php",
     data: my_data,
     success:function(response){
         $("#my_frame").html(response);
     }
   });
}

部分结果:

  1. chrome控制台记录关于jquery.min.js:4的警告

主线程上的同步XMLHttpRequest已弃用,因为它对最终用户的体验有不利影响。如需更多帮助,检查https://xhr.spec.whatwg.org/。

  • 一些CSS得到bug和一些字体/字体-重量改变
  • p 在ajax中。我已经尝试过这个替代方案,但问题是相同的:

    $('#my_iframe').append(result);
    

    要更新iframe,只需更新它的src属性,如下所示:

    $('iframe#my_iframe').attr('src', 'iframe.php');
    

    把它放在ajax success回调中。iframe会重新加载